Ribiru ailemize yeni yazar arkadaşlar arıyoruz! Aramıza katılmak isterseniz buraya tıklayın!

6- HTML – CSS Kavramları ve Temelleri İçin Bir Kılavuz: Satır Stilleri

Satır içi stil kodları herhangi bir css stil dosyasına yazılmış koddan daha etkilidir. Elementin stili öncelikli olarak satır içindekine göre ayarlanır. Satır içi kodların fazlalığı sayfa kirliliğine sebebiyet verebilir.

<div style="color: blue;">Herhangi bir sınıf veya id içermeyen sadece satır içi stil içeren mavi bir yazı.</div>

Important! (Önemli!)

Bir elemente satır içi veya birden fazla class üzerinden stil verildiyse yeni bir stil ile hepsini ezmek için !important kullanılabilir. !important kullanılan yerdeki stil alt, üst veya satır içi stil kodlarını görmezden getirir.

div {
  color: blue !important;
}
<div style="color: gray;">Ben mavi bir yazıyım. Nasıl mı? İşte böyle.</div>

Lütfen !important’ı çok, çok nadir kullanmaya özen gösterin. !important yalnızca kesinlikle gerekli olduğunda kullanılmalıdır. Örneğin satır içi stiller kullanan ve üzerinde kontrolünüz olmayan bazı üçüncü taraflara stil vermek gibi ve birkaç durumda.

Özgüllük Hiyerarşisi

En az spesifikten en spesifike doğru:

SeçiciÖrnekÖzgüllük
Tip seçicih10 0 0 1
Sınıf, özellik seçicileri.class[type="text"]0 0 1 0
ID seçici#contact0 1 0 0
Satır stili<div style="background: purple">1 0 0 0
!important kullanımıdiv { color: green !important }Tümünü geçersiz kılar

Zeen is a next generation WordPress theme. It’s powerful, beautifully designed and comes with everything you need to engage your visitors and increase conversions.