今天看代码时遇到一段不理解的地方。
#note_content {
line-height: 22px;
border: #DEDEDE 1px solid;
background: #FAFAFA;
padding: 10px;
word-break: break-all;
word-wrap: break-word;
margin: 40px 0 10px 0;
min-height: 360px;
height: auto !important;
height: 360px;
}
不太理解后三行代码含义。
现在记录一下,方便以后查看:!important是Firefox专用的一个标记。
这段代码的含义是同时兼容firefox和IE的最低高度360排序,和高度自适应。
第一行设置 min-height:360px;对Firefox有效;第二行height:auto !important;也对Firefox有效。后面紧跟的“!important”是Firefox专用的一个标记,带有这个标记的设置具有最高优先 级,之后的设置都无效。所以第三行的height:360px对Firefox无效了;
同时,由于IE无法识别min-height和“! important”,所以只有第三行有效,由于IE默认就是高度自适应的,所以即使设置了360px的高度,只要内容很多,也会自动撑开,不需要设置 height:auto。
挺神奇的。