1

这是一个来自 HTML 语言切换的简单代码示例。CSS 应该分隔 span 元素并在其间显示一个点：

 <html>
      <head>
        <style type="text/css">
            .languageSwitch span:before {
                content: "•";
                padding: 0 4px;
                font-weight: normal;
            }
            .languageSwitch span:first-child:before {
                content: "";
                padding: 0;
            }
            .languageSwitch .current {
                font-weight: bold;
            }
        </style>
      </head>
   <body>
    <div class="languageSwitch">
      <span><a href="?lang=de">Deutsch</a></span>
      <span class="current">English</span>
      <span><a href="?lang=fr">français</a></span>
    </div>
   </body>
  </html>

这在 Firefox 中运行良好，但 Internet Explorer 9¹ 只是忽略了 :before 指令。在“开发人员工具”CSS 对话框中，“内容”属性也不会显示。我在网上搜索过：IE 8 有伪元素问题，但 IE 9 应该知道，这是“旧”的 CSS 2。

有人知道为什么会失败（IE 9 中的错误？）或者语法必须是什么样的吗？

1) 要明确：版本 9.0.8112.16421 / “Updateversion” 9.0.6 (KB2675157)

4

2 回答 2

2

检查文档类型。在 jsfiddle 上，这在 IE9 中运行良好：http: //jsfiddle.net/4nGW9/。IE8 也应该处理这个问题。

于 2012-07-05T07:55:21.410 回答
2

我可以在 IE 9 中看到这些点。与您的版本完全相同。我的代码中唯一的区别是顶部的有效 HTML5 文档类型。

如果没有有效的文档类型，IE 可能会将其对您的页面的呈现切换到怪癖模式，或者 IE8/IE7 的呈现模式，它不会处理像第一个孩子或生成的内容这样的伪选择器。

在 browserling 中查看您的页面。

于 2012-07-05T07:56:09.320 回答