Question

我在div中包含了两个段落。我想让第一段文本稍大一些，但使用：first-child不能像我调用它一样工作。不知道出了什么问题。

        <div id="main-content">
            <h2 class="title">
                About Us
            </h2>
            <p>Formerly Days Hotel Waterford, Treacys Hotel Spa & Leisure Centre is situated in the heart of Waterford City in Ireland's Sunny South-East, and is proud to be one of the finest hotels in Waterford.  The hotel is the perfect choice for your business, leisure and family breaks.  Guests can dine in Croker's Restaurant, enjoy a drink with friends in Timbertoes bar, relax in the swimming pool or Jacuzzi at Spirit Leisure Centre or be pampered at Spirit Beauty Spa.
            </p>
            <p>
                The hotel is ideally located on the Quays in Waterford and is just a five minute walk from both the bus and train stations, and only 10km from Waterford Airport.  Treacys hotel is one of the finest hotels in Waterford city centre and is a popular location for visitors who love shopping, golf, surfing, or choose from our selection of great value packages, including pampering spa breaks and activity breaks. 
            </p>
        </div><!-- inner content End -->

CSS：

#main-content p:first-child {
font-size:16px;
}

Answer 1

#main-content的第一个孩子不是p，而是h2。

如果您要将规则应用于第一个p，请使用CSS3 :first-of-type：

#main-content p:first-of-type {
    font-size:16px;
}

或者h2:first-child带有兄弟选择器，它可以更好地播放IE：

#main-content h2:first-child + p {
    font-size:16px;
}

Answer 2

如果h1中只有title个div，那么您可以避免使用高级CSS选择器来支持使用此代码的更多浏览器：

h2.title + p {
    font-size:16px;
}

Answer 3

这不是第一个孩子，h2元素是。

您可以使用#main-content h2 + p。它有很好的浏览器支持。有更好的适合度（见BoltClock's answer），但遗憾的是IE正在阻止使用它们。

：第一个孩子没有选择第一段

3 个答案: