使用现代CSS从第一个元素中删除上边距

Question

是否可以使用CSS和最新的Chrome或Firefox 自动从第一个<h1>标记中删除上边距，还是仍然必须使用jQuery？

Answer 1

您只需要h1:first-child { margin-top: 0px; } DEMO

Answer 2

没有:first-of-page选择器所以没有，你不能确定使用CSS。 CSS中没有办法从页面中提取所有h1，无论是父母和兄弟姐妹，只接受第一个 你需要更多地了解你的h1元素。

示例：

• 如果它也是body > header（或HTML 4.01中的#header）的（第一个或唯一的）子项，则可以选择第一个h1
• 如果所有h1都是兄弟姐妹，那么h1:first-of-type是肯定的第一个
• 如果第一个h1正好位于某个部分中的主导航后，则body > nav + section > h1会选择它。或者body > header > nav + section > h1:first-of-type

Answer 3

div#content h1:first-child { margin-top:0; }

AFAIK这在IE6中不起作用，可能在IE7中出错。

Answer 4

伪选择器。

h1:first-child {
    margin-top: 0;
}

请注意，Failbrowsers（IE 7及更早版本）不支持这些，因此您可能仍需要jQuery备份解决方案。

Answer 5

在h1标签中添加一个类，如：

<h1 class="first">Your text</h1>

然后在css中：

.first
{
    margin-top: 0;
}