我应该在我的 HTML 页面上的什么位置放置 IF 语句？答案

【问题标题】：Where do I put IF statement on my HTML page?我应该在我的 HTML 页面上的什么位置放置 IF 语句？
【发布时间】：2011-12-14 17:01:42
【问题描述】：

我正在尝试让我的网站在 ie6 和 ie7 上正常显示，他们说您必须使用以下语句：

 <!--[if IE 6]> <link href="ie6.css" rel="stylesheet" type="text/css"> <![endif]-->

现在我应该在我的 HTML 页面中的什么位置放置这个语句？

编辑：

所以我在 doctype 之后添加了这个：

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
  /TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <!--[if lt IE 7]><html class="ie6" lang="en"><![endif]-->
  <!--[if IE 7]><html class="ie7" lang="en"><![endif]-->
  <!--[if IE 8]><html class="ie8" lang="en"><![endif]-->
  <!--[if gt IE 8]><!--><html lang="en"><!--<![endif]-->
  <head>

在我的样式表 ie6.css 我有这个：

.ie6 #magazine_style_left {
position:relative;
float:left;
width:150px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:14px;
color:#999999;
font-style:italic;
line-height:18px;

}

.ie6 #magazine_style_right {
position:relative;
float:right;
width:519px;
border-left: 1px solid #F2F2F2;
}

我已经在同一页面上添加了 css，但它仍然无法正常工作。就像它没有拿起/使用 ie6 css

【问题讨论】：

标签： html css internet-explorer-7 internet-explorer-6

【解决方案1】：

head 标签内

<head>
<!--[if IE 6]> <link href="ie6.css" rel="stylesheet" type="text/css"> <![endif]-->
</head>

【讨论】：

【解决方案2】：

提及这一点可能有助于澄清一些事情：

IE conditional comments，例如 可以在文档中的任何位置出现*。在<head>、<body>、<li> 元素或<form> 等中。其中的内容（可以是任何东西*）将根据使用的规则呈现（或不呈现）。

^{* 可能有例外，但我不知道有什么具体的例外。}

知道了这一点，问题真的归结为“我在哪里放置<link> 标签”，正如其他答案所提到的，这当然是在<head> 中。

还有另一种定位 IE 的方法，如下所述：

http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

一段时间以来，标准社区已经团结起来条件样式表作为验证问题的解决方案。

虽然有一些问题：

条件样式表意味着要下载 1 或 2 个额外的 HTTP 请求

由于它们位于中，因此页面的呈现会等待它们完全加载。

另外 – 雅虎的内部编码最佳实践不推荐条件样式表

它可以将单个 CSS 规则分成多个文件。我花了很多时间想知道“这条规则是从哪里来的！？” 当它被隐藏在条件样式表中时。

这是我提出的解决方案：



 <html>         
使用相同的条件 cmets，我们只是有条件地添加 html标签上的一个额外类。这使我们能够保持我们的同一文件中特定于浏览器的 css：
div.foo { color: inherit;}
.ie6 div.foo { color: #ff8000; }
此外，它完全验证并适用于所有浏览器。

我强烈推荐这种攻击 IE 的技术，绝对值得一试。

【讨论】：

嗨 - 非常有用！谢谢！好的，所以我需要在这个 css 规则中去掉或一半的填充才能在 ie6 中正常运行：#magazine_style_left { position:relative;向左飘浮;宽度：150px；填充右：20px； font-family:Georgia, "Times New Roman", Times, serif;字体大小：14px；颜色：#999999;字体样式：斜体；行高：18px；所以你说我必须在我的标题中添加这个：并将 .ie6 添加到 magazine_style_left，所以它看起来像： .ie6 #magazine_style_left {...} ?
没错，使用这种技术，您可以使用.ie6 #magazine_style_left 从普通样式表中仅在 IE6 中选择元素。在这种情况下，IE 条件 cmets 仅用于将 ieX 类添加到 html 元素，并打开标签。它在您的文档类型之后，在您的 <head> 标记之前（<html> 标记始终位于的位置）。
对了，对不起，你要处理IE6，我哭了，因为我要支持IE8！
IE 让我们的生活变得悲惨！！我很遗憾听到这个消息，但你听起来很清醒！ - 这对你来说肯定是小菜一碟吗？我试过你上面提到的 - 但它不起作用 - 请在我上面的问题中查看我的编辑。
我遇到了这个问题：dustinbrewer.com/css-fix-for-the-double-margin-float-bug-in-ie6 向下滚动到站点损坏的图像。我的右浮子正在下降到我的左浮子的下方和右侧。我知道不是 IE6 加倍的填充导致浮动对于父元素来说太宽，因此丢弃了我的右浮动 div。为什么我们必须与 IE 共存！！

【解决方案3】：

在您的其他 CSS 包含旁边的 <head> 中。这当然意味着您有一个修复 IE6 特定问题的ie6.css 文件。

【讨论】：

嗨，好的，我认为这应该是它应该去的地方（在其他 css 链接 href 文件下）。是的，我确实有一个带有 css 的 ie6.css 文件，但它似乎不起作用（因此我想知道我是否将语句放在错误的位置）

【解决方案4】：

你应该把它放在head标签内，可能就在你的其他css包含之后，因为定义冲突的地方，包括head标签将覆盖之前的定义。

【讨论】：