min height reached（css属性解释：min-height: 100%;）

：暂无数据 2026-03-28 12:40:02 ：0

曾几何时，我也觉得min height reached高不可攀，尤其css属性解释：min-height: 100%;更是一头雾水。后来才发现，只是没找对方法，希望我的经验能帮到你。

本文目录

css属性解释：min-height: 100%;
css中min-height和height的问题
CSS的min-height怎么用
css min-height是什么意思
CSS设定最低高度自动增加高度
min-height:2em什么意思 ,margin:0 0 40px 0 能表示居中吗
css怎么设置最大高度和最小高度
min-height属性都有哪些浏览器支持呢还有ie哪些版本
html/css中max-height，height和min-height到底是什么区别详细的解释一下

css属性解释：min-height: 100%;

最小高度，CSS3中的样式。IE6不支持。
比如min-height:20px;
意思是说，一个块元素，高度如果小于20像素，那么这个块元素就不会再自动变小，而是保持20像素不变。如果大于20像素，那么不受限制
至于，取值100%的意思，是这个高度值使用父元素的高度值做限定

当我们给块级元素设置响应式高度的时候，例如给div设置height=50%，往往没能看到效果。
原因是百分比的大小是相对其父级元素宽高的大小，如最外层元素设置的百分比是对应屏幕而言的。
需要了解的是对于宽度来说，其父级元素无须确定宽度就能设置百分比，例如我们可以利用这个特性给未知宽度的块级元素设置水平居中效果：
父元素css： position: relative/absolute; left: 50%;
子元素css： position: relative; left: -50%;
但高度则不同，若某元素的父元素没有确定高度，则无法有效使用height=XX%的样式，我们可以这样解决（假设最外层的div需要设置百分比高度样式）：
html, body {
height: 100%;
}
.outDiv {
height: 50%;
}
不过这里有个需要注意的，若div里的内容超出了div的高度，在IE7+的浏览器是无法将div撑起来的（IE6则可以），如果要顾及这一点，可以使用min-height解决（当然也要考虑IE6不支持min-height的问题）：
html, body {
height: 100%;
}
.outDiv {
min-height: 50%;
}
* html .outDiv {
height: 50%;
}
最后说通俗点，如果你想把高度设为百分比，那么父级必须设置高度

CSS的min-height怎么用

min-height就是你设置的这个元素的最小高度，因为在浏览器里容器的大小可能会被其中的内容撑大，设置这个属性后就能保证你的布局一直正确，因为它最小不会小于你设的那个值 max-height就上最大高度了。不过IE不支持这两个属性，max-width和min-width也一样。而line-height就是控制段落的行高，也就是每一行文字的高度。这些属性不难理解，只要多上机自己多实践下就会明白了。

css min-height是什么意思

min-height就是你的层的最小高度，如果该层中的元素内容高度小于这个高度，就将层显示为min-height的值，超过的话，就撑破层，使层的高度与元素内容高度一样。
max-height就是和这个相反了，不超出的话，层高度就和层中内容元素高度一样，否则就截断内容，显示max-height的高度。
line-height是行高，就是针对文本的，即一行文字的行高，是以该标签中文字大小font-size做比较的，例如line-height=200%；就是让行高是文字大小的两倍。（不同浏览器默认的行高不一样哈~~)

CSS设定最低高度自动增加高度

假如你希望的默认高度是500px，那么就可以这么定义它的css：
height:auto; min-height:500px; _height:500px;
这样这个元素就回保持最低高度500px，超过高度自动增加了~
后面的“_height:500px;”是为了解决IE6不能识别min-height属性的bug，在IE6里面，min-height虽然不能被识别，但是如果超过了规定高度，又没有设置overflow:hidden的话，div的高度会自动增加的。

min-height:2em什么意思 ,margin:0 0 40px 0 能表示居中吗

不太满意他们的回答。我也来回答一下吧。

min-height:2em 关于这个的意思，他们解释了，就是最小高度为2em
那么什么是2em呢，这里用例子解释一下吧。
1.1《p style="font-size:20px;line-height:2em;"》字高20px，行高2em。《/p》
上面语句中，P的行高为：20px * 2em = 40px;
1.2《p style="font-size:30px;line-height:2em;"》字高30px，行高2em。《/p》
上面语句中，P的行高为：30px * 2em = 60px;
总结一下，虽然行高都为2em，结果却不一样。
所以，不能像他们说的一样，和**，CM等，是一种单位。他是一种相对距离，不是固定的。
margin:0 0 40px 0
他的值为： 0    0    40px    0
分别对应：上   右     下     左
因为，上，右，左都为0，下为40px,   那么左右边距都为0的情况下，你可以理解为居中，也可以理解为居左，也可以理解为居右，因为它和父元素的宽度是一样的。

css怎么设置最大高度和最小高度

布局过的人都知道CSS的最小高度min-height是个很有用的属性，它可以让很短的内容也有一个很合适的高度，使页面显得美观。但很可惜IE6不支持这一属性。怎么办呢？我们可以用另外一种方法让IE6也有最小高度min-height属性的效果。众所周知，如果内容超过元素的高度，那么IE6是会自动增加元素的高度，即使你明确的定义了元素的高度。我们可以利用IE6的这个bug来让IE6也有最小高度min-height属性的效果。具体代码如下：height:auto !important;height:500px;解释：1、由于IE6对!important的解释存在bug，所以它只识别height:500px这一句，超过500px后，IE6自身会增加盒子的高度；2、IE7和其他标准浏览器三句都能识别，虽然定义height:500px，但我们又有了height:auto !important，所以超过500px也能自动增加盒子的高度。三句代码让IE6也有了最小高度min-height的效果，简单又实用，不错吧。