在 Safari 5.1.3 中，我刚刚注意到，在编写 CSS 相邻兄弟选择器(呃 + 一个)和引用 <nav> 时元素 - 浏览器无法遵守 CSS。
所以:
h1 + p { ... } /* works fine */
h1+p { ... } /* works fine */
和
h1 + nav { ... } /* works fine */
h1+nav { ... } /* but, does NOT work */
我已经用其他 html 5 元素(部分、文章、旁白)测试了它们，它们似乎工作正常。直到您将导航元素放入组合中；然后它坏了。这是一个jsfiddle .
事实证明这令人沮丧，因为我的 Rails Assets 打包器正在缩小 css 并删除不必要的空间。这不是 IE7、Firefox、Chrome 或 Opera 的问题 - 但 Safari 5..
其他人有类似的吗？知道为什么？知道修复方法吗？
最佳答案
这绝对是一个 Safari 错误，您应该在 Mac 上使用 Safari > Report Bugs to Apple... 或Help > Report Bugs to Apple... 在 PC 上(或工具栏按钮，如果它显示在 Safari 工具栏上)。
如果 Asset Packager 有相应选项，最简单的方法是禁用 CSS 缩小。
如果它没有这样的选项，则有一个快速而肮脏的解决方法:如果你只有一个 nav紧跟在您的 h1 之后的元素, 您可以使用 general sibling selector ~ 相反，因为 Safari 似乎没有任何问题:
h1 ~ nav { ... } /* works fine */
h1~nav { ... } /* works fine */
如果你有多个 nav您的 h1 之后的元素，您必须手动覆盖后续 nav 的样式元素使用 h1 ~ nav ~ nav .
关于CSS 相邻兄弟选择器、Safari 和 <nav> 元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9318474/