ugrás a tartalomhoz

CSS fist-child, last-child, nested

therest · 2011. Okt. 11. (K), 15.12
Helló!

Van egy ilyen struktúrám:
  1. <div class="blockTitle">  
  2. <div>Blokk cím</div>  
  3. <div>Block menu</div>  
  4. </div>  
A kérdésem az, hogy hogyan tudok olyan css stílusokat definiálni, amivel a két belső div-et külön formázom. Max CSS2, crossbrowser megoldást keresnék rá.

Próbáltam a :first-child, :last-child segítségével megoldani, de ha jól szűrtem le ezeket nem lehet saját osztályhoz társítani, mint amilyen a .blockTitle.
 
1

Példa

Poetro · 2011. Okt. 11. (K), 15.53
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.   <title>Page Title</title>  
  5.   <style type="text/css">  
  6.     body {  
  7.       background: grey;  
  8.     }  
  9.     .blockTitle {  
  10.       background: white;  
  11.     }  
  12.     .blockTitle div:first-child {  
  13.       background: red;  
  14.     }  
  15.     .blockTitle div:last-child {  
  16.       background: green;  
  17.     }  
  18.   </style>  
  19. </head>  
  20. <body>  
  21.   <div class="blockTitle">  
  22.     <div>Piros</div>  
  23.     <div>Fehér</div>  
  24.     <div>Zöld</div>  
  25.   </div>  
  26. </body>  
  27. </html>  
2

Köszi. Nekem kicsit fura ez.

therest · 2011. Okt. 11. (K), 16.46
Köszi. Nekem kicsit fura ez. A .BlockTitle div {} a blockTitle osztály minden div gyermekére vonatkozik, igaz? A fenti .blockTitle div:first-child {} akkor miért nem a blockTitle összes div gyermekének, első gyermekére vonatkozik?
3

.blockTitle div:first-child

Poetro · 2011. Okt. 11. (K), 16.54
.blockTitle div:first-child {} akkor miért nem a blockTitle összes div gyermekének, első gyermekére vonatkozik?

Az a .blockTitle div :first-child lenne. Amennyiben csak tényleges gyermekekről lenne szó, akkor .blockTitle > div > :first-child.

A div:first-child-dal azokra korlátozok, amik div-ek és :first-child-ok is egyszerre.
4

Ha jól látom, akkor mindössze

therest · 2011. Okt. 12. (Sze), 16.36
Ha jól látom, akkor mindössze egy space a különbség van ".blockTitle div :first-child" és ".blockTitle div:first-child" között?
És akkor az első a blockTitle összes div gyermekének, első gyermekére vonatkozik, a második pedig amik div-ek és :first-child-ok is egyszerre?

Milyen magyar nyelvű forrást ajánlanál CSS témában, ami átfogó, és az újabb dolgokat is (css3) érinti?
5

szabályok

Poetro · 2011. Okt. 12. (Sze), 17.01
Ha a két elem között csak szóköz van, akkor az első akár milyen mélységű leszármazottjáról van szó. Természetesen megadhatsz viszonyt a kettő között, a > a közvetlen gyermeket jelenti például. Magyar nyelvűt nem tudok neked ajánlani, de van sok angol könyv a témában. Például HTML5 & CSS3 for the Real World. De Amazon-on, vagy Kiskapunál valószínűleg találsz több könyvet is CSS témában, magyarul vagy gyengét, vagy régit.
6

Magyar könyv

Pepita · 2011. Okt. 14. (P), 14.33
Ajánlom könyveit, többek közt a gyerek - szülő - stb. elég jól benne van a Web programozás alapismeretek című könyvében.