CSS Nedir?
CSS, bir HTML belgesine stil vermek için kullandığımız dildir. CSS, HTML öğelerinin nasıl görüntülenmesi gerektiğini açıklar. HTML sayfalarına farklı şekillerde CSS stilleri verebiliriz.- Inline CSS: Satır içerisinde kullanmak. Örneğin < p style="background-color:red">
- Internal CSS: Html sayfasının head bölümünde style etiketi kullanılarak sayfaya stil verebiliriz.
- External CSS: CSS kodlarını .css uzantılı bir dosyada yazarak html sayfasında head bölümünde < link rel="stylesheet" href="dosyaadı.css"> css dosyasını konumlandırılara kullanmak.
Selector { CSS Cod} şeklinde yazılır.
Selector Çeşitleri
Etiket | HTML < > | CSS { } |
---|---|---|
Etiket isminini kullanılarak | < p> Paragraf < /p> | p {color: red} |
Class etiketi kullanılarak | < p class="blog1"> Paragraf < /p> | .blog1 {color: red} |
Id kimliğini kullanılarak | < p id="blog1"> Paragraf < /p> | #blog1 {color: red} |
Sayfanın bütün etiketlere uygulamak için * selector |
< p> Paragraf < /p> | * {color: red} sayfadaki tüm yazıları kırmızı yapar. |
CSS'de Etiketlerin Önceliği
Aynı etiket ismi(selector)kullanıldığında en baskın olan en son yazılan etiket olur.Örneğin style etiketinin içerisine;
h1 {background-color: red;}
h1 {background-color: blue;}
Şeklinde yazdığımız css kodların en baskını en son satırdaki olur. Yani bu durumuda sayfanın arka plan rengi mavi olacaktır.
Öncelik Etiket Sıralaması
- Inline Selector: < p style="">
- Id Selector: #Selector{ }
- Class Selector: .Selector{ }
- Tag Selector: p { }
HTML ve CSS codlarını derlemek için HTML-CSS-JavaScript tıklayınız.