这个CSS代码是否正确？

Question

.divTest { 
    min-height: 500px; 
    height: auto !important; 
    height: 500px; 
}

我有以下CSS代码,我在http://www.cleancss.com/上测试了它,它取出了height: 500px.发生这种事的原因是什么？

Answer 1

!important命令接管任何其他...因此您的height:500px;行将始终被忽略(这就是优化程序将该行取出的原因).

如果你希望你的div只有500px的高度,那么你的CSS应该只是:

.divTest {
    height:500px;
}

如果你希望你的div有不同的高度,不小于500px那么你的CSS应该是:

.divTest {
    min-height: 500px;
    /* height:auto; - implied */
}

你不需要!important这个css片段,除非有一些影响高度的其他规则,你需要覆盖它.您不需要指定,height:auto因为这是div的默认样式(除非您继承其他内容;))

如果你正在使用IE6,那就有一个解决方法:

.divTest {min-height:500px;}
* html .divTest {height:500px;}