Question

好的，这是我第一次使用html5boilerplate，但无法从我的css文件中获取IE样式。

我在标题中有这个（按照页面设置）

<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!-- Consider adding a manifest.appcache: h5bp.com/d/Offline -->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>

在我的样式表中我有

#container { float:right; margin-top: 0px; }

.ie6 #container { margin-top: 5px; }

.ie7 #container { margin-top: 10px; }

.ie8 #container { margin-top: 15px; }

它不起作用。这真的很简单，我错过了什么。

感谢您的建议。

Answer 1

除非您使用的是某些javascript shiv，否则您应该使用实际定义的内容：

html class="no-js lt-ie9 lt-ie8 lt-ie7

所以试试，

#container { float:right; margin-top: 0px; }

.lt-ie7 #container { margin-top: 5px; }

.lt-ie8 #container { margin-top: 10px; }

.lt-ie9 #container { margin-top: 15px; }

Answer 2

CSS类名称不匹配。例如，条件注释中的 lt-ie8 和样式表中的 ie8 。

我使用过的一个版本：

<!--[if lt IE 7 ]> <html class="no-js ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="no-js ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="no-js ie ie8" lang="en"> <![endif]-->
<!--[if IE 9 ]>    <html class="no-js ie ie9" lang="en"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

结合CSS规则，如：

.ie6 #container {...}
.ie7 #container {...}
.ie8 #container {...}

Answer 3

我在那些条件语句中看到名为“lt-ie7”，“lt-ie8”和“lt-ie9”的类，但在你的CSS中我看到你使用名为“ie6”，“ie7”和“ ie8“，这是不同的。尝试：

#container { float:right; margin-top: 0px; }

.lt-ie7 #container { margin-top: 5px; }

.lt-ie8 #container { margin-top: 10px; }

.lt-ie9 #container { margin-top: 15px; }

html5boilerplate IE条件不起作用

3 个答案: