Saya telah melihat karakter ini beberapa kali dalam file CSS tetapi saya tidak tahu bagaimana menggunakannya. Adakah yang bisa menjelaskannya kepada saya dan menunjukkan betapa mereka berguna dalam membuat gaya halaman lebih mudah?
Saya telah melihat karakter ini beberapa kali dalam file CSS tetapi saya tidak tahu bagaimana menggunakannya. Adakah yang bisa menjelaskannya kepada saya dan menunjukkan betapa mereka berguna dalam membuat gaya halaman lebih mudah?
Jawaban:
Ini adalah pemilih anak CSS. P > SPAN
berarti menerapkan gaya yang mengikuti semua tag SPAN yang merupakan anak-anak dari P
tag.
Perhatikan bahwa "anak" berarti "keturunan langsung", bukan sembarang keturunan. P SPAN
adalah pemilih keturunan , menerapkan gaya yang mengikuti semua SPAN
tag yang merupakan anak-anak dari P
tag atau anak-anak dari tag lain secara rekursif yang merupakan anak / keturunan dari sebuah P
tag. P > SPAN
hanya berlaku untuk SPAN
tag yang merupakan anak-anak dari P
tag.
p em
akan cocok dengan apa pun <em>
yang ada dalam a <p>
. Misalnya, itu akan cocok dengan <em>
s berikut :
<p><strong><em>foo</em></strong></p>
<p>Text <em>foo</em> bar</p>
Di samping itu,
p > em
Hanya akan cocok dengan <em>
anak-anak langsung dari <p>
. Jadi itu akan cocok:
<p>Text <em>foo</em> bar</p>
Tapi tidak:
<p><strong><em>foo</em></strong></p>
ini dikenal sebagai Child Combinator:
Pemilih kombinasi anak ditambahkan untuk dapat menata konten elemen yang terkandung dalam elemen tertentu lainnya. Sebagai contoh, misalkan seseorang ingin menetapkan putih sebagai warna hyperlink di dalam tag div untuk kelas tertentu karena mereka memiliki latar belakang gelap. Ini dapat dicapai dengan menggunakan periode untuk menggabungkan div dengan sumber daya kelas dan tanda lebih besar dari sebagai kombinator untuk menggabungkan pasangan dengan, seperti yang ditunjukkan di bawah ini:
div.resources > a{color: white;}
(dari http://www.xml.com/pub/a/2003/06/18/css3-selectors.html )
E > F
Cocok dengan setiap elemen F yang merupakan anak dari elemen E.
lebih lanjut tentang http://www.w3.org/TR/CSS21/selector.html#child-selectors