2011-11-01 86 views
2

我有兩個段落包在一個div。我想讓第一段文字稍微大一點,但是使用:第一段孩子不會像我所說的那樣工作。看不出有什麼不對。:第一個孩子沒有選擇第一段

 <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; 
} 

回答

7

#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; 
} 
+0

謝謝,h2:第一個孩子+ p做的竅門 –

+0

+1'第一類型' – Mohsen

1

這不是第一個孩子時,h2元素。可以使用#main-content h2 + p。它有很好的瀏覽器支持。有更好的配合(請參閱BoltClock's answer),但令人遺憾的是IE停止使用它們。

3

如果您只有h1titlediv,那麼你可以避免使用高級CSS選擇器來支持更多的瀏覽器使用此代碼:

h2.title + p { 
    font-size:16px; 
} 
相關問題