WEB 教程
实践 示例
HTML 参考手册
CSS 参考手册
PHP 参考手册

如何为 Internet Explorer 定义或创建样式表

主题:HTML / CSS上一页|下一页

答案:使用 IE 条件样式表

如果您是一名网页设计师,您在处理 IE 错误时可能会有糟糕的经历。 大多数时候您无法摆脱它,可能是因为项目要求或您的客户仍在使用旧版本的 Internet Explorer (IE)。 所以让我们来处理它。

每个版本的 IE 的行为都与其他版本有所不同。 所以我们在这里所做的是为不同版本的 IE 浏览器定义单独的样式表,以查明特定版本中的确切问题。

假设您为某些元素定义的 CSS 属性在 IE 中无法正常工作,但在 Firefox 或 Chrome 等其他浏览器中却可以正常工作。 所以基本上我们所做的就是定义一个只针对 IE 浏览器的样式表,然后我们要么调整该属性的值,要么在这个样式表中添加一些新属性来解决这个问题。 这是一个例子:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>IE Only Style Sheet</title>
<link rel="stylesheet" href="css/default.css">
<!--[if IE]>
    <link rel="stylesheet" href="css/ie.css">
<![endif]-->
</head>
<body>
    <h1>Define Style Sheet for IE</h1>
    <p>If you open this page in IE the output will be different.</p>
</body>
</html>

条件样式表的开始和结束标记只是常规的HTML 注释。 在括号之间放置条件语句,其含义如下。

  • "IF"和"IE"的含义相当明显。
  • ! 代表"非",所以 !IE 表示"非 IE"。
  • gt 代表"大于"。
  • gte 代表"大于或等于"。
  • lt 表示"小于"。
  • lte 表示"小于或等于"。

仅 IE 样式表

条件语句可能是创建仅 IE 样式表以修复 IE 错误的最常用方法,尤其是在旧版本中。 以下部分总结了针对不同版本 Internet Explorer 浏览器的语法。

针对所有版本的 IE

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

针对除 IE 以外的所有浏览器

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

仅针对 IE9 版本

<!--[if IE 9]>
    <link rel="stylesheet" href="css/ie9.css">
<![endif]-->

针对 IE9 及更高版本

<!--[if gte IE 9]>
    <link rel="stylesheet" href="css/ie9-and-higher.css">
<![endif]-->

同样,您可以为其他版本的 Internet Explorer 定义样式表。


FAQ 相关问题解答

以下是与此主题相关的更多常见问题解答:

Advertisements