h1 - Select 秒无效

Question

我在处理第二个 h1 时遇到了一些问题 select。如果我尝试 select 第一个，效果很好，但第二个不起作用。你能看一下吗？

.sidemal h1:nth-child(2) {
    margin-top: 0px;    
}

我试过使用 !important，但没用。

有什么想法吗？

Link 到站点：http://tinyurl.com/pk9me6e

<section>
    <div class="col-md-12">
        <h1 class="page_title">Header 1</h1>
    </div>
</section>

<div class="col-md-12">
    ...
    <h1>Header 2</h1>
    ...
</div>

Answer 1

除非你的标记字面意思是：

<... class="sidemal">
    <h1>Heading 1</h1>
    <h1>Heading 2</h1>
    ...
</...>

...中间没有任何元素，您的第二个 h1 元素将不会是第二个 child。如果你想 select 第二个 h1 元素，你可以改为使用 :nth-of-type select 或者：

.sidemal h1:nth-of-type(2) { ... }

更新

查看您的页面后，无需使用任何形式的 :nth- select 或。您的第二个 h1 元素包含在 article 元素中，而您的第一个元素不是。因此，我们可以改用：

.sidemal article h1 { ... }

演示

.sidemal article h1 {
  color: red;
}

<div class="sidemal">
  <h1>First <code>h1</code> element</h1>
  
  <article>
    <h1>Second <code>h1</code> element</h1>
  </article>
</div>

Answer 2

要select每秒H1你可以用

.sidemal H1 + H1 { 
    margin-top: 0px;  
}

h1 - Select 秒无效

h1 - Select second won't work

css

css-selectors

更新

演示