CSS * Nedir? sorusuna cevap aramak için geldiyseniz doğru yerdesiniz. CSS’de * evresnsel seçici olarak kullanılır. Bu yazıda evrensel seçici kullanımını öğrenecek ve örnekler bulacaksınız.
CSS tarafından sağlanan evrensel seçici, HTML sayfasındaki herhangi bir öğenin seçilmesine yardımcı olur. Tek bir öğeyle birlikte gelir ve seçiciyi evrensel bir seçici olarak belirtmek için kullanılan yıldız (yani “*”) sembolünü kullanır. Genellikle bir yıldız ve ardından bir seçici olarak yazılır. * tüm elemanları seçmek için kullanılır. Bu yıldız, başka bir öğenin içindeki tüm öğeleri seçme yeteneğine de sahiptir.
Evrensel seçici, web sayfanızdaki tüm HTML öğelerine belirli bir stil eklemek istediğinizde yardımcı olur. Ayrıca, HTML sayfanızın öğesindeki her bir öğe için de kullanılabilir.
Bu seçicinin temel sözdizimi şöyledir:
|
1 2 3 4 5 |
* { ozellik: deger; } |
Örnek 1:
|
1 2 3 4 5 6 |
* { margin : 0px; padding : 0px; } |
Yukarıdaki CSS kodu tüm HTML öğelerinin dış ve iç boşluklarını “0” yapar.
Örnek 2:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<!DOCTYPE html> <html lang="tr"> <head> <title>Tasarım Kodlama</title> <style> *{ color:red; } </style> </head> <body> <h1>Tasarım Kodlama</h1> <p>Merhaba Dünya</p> <p lang="en">Hello World</p> </body> </html> |
Yukarıdaki kodda tüm HTML öğlerinin yazı rengi kırmızı(red) yapılmıştır.
Çıktısı:
Küresel seçici diğer CSS seçicileri ile birlikte kullanılabilir.
Örnek 3:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<!DOCTYPE html> <html lang="tr"> <head> <title>Tasarım Kodlama</title> <style> * [lang^=en] { color: green; } * h1{ color:red; } </style> </head> <body> <h1>Tasarım Kodlama</h1> <p>Merhaba Dünya</p> <p lang="en">Hello World</p> </body> </html> |
Çıktısı:
Çok daha fazla CSS konusu için CSS Dersleri yazısına bakabilirsiniz.
Yorum Yap