css - :first-child not selecting first paragraph

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 的第一个 child 不是 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;
}