Atribut class

Atribut class element üçin (element diýilende tag) bir ýa-da birnäçe klas bellenýär.

Bu, şol bir klas bellenen elementler toplumyna CSS üsti bilen çykmak we olar üçin belli aýratynlyklary (meselem, tekstiň reňkini üýtgetmek, şriftiň ululygyny we ş.m.) ulanyp bolmak üçin edilýär.

Şeýle hem atribut id bar, ol atribut class ýaly HTML sahypasyndaky elementleri saýlamaga mümkinçilik berýär.

Atribut class bilen atribut id arasyndaky tapawut şonda: class elementler toplumyny saýlaýar (hatda ony bir element üçin bellän bolsaňyz hem -soňra ony beýleki elemente hem bermek mümkin), id bolsa biri-birini meňzeş bolmadyk elementi saýlaýar (sahypada şeýle id-li beýleki element bolmaly däl, ýogsa çaknyşyk döređer).

Elemente näme bermeli - klasmy ýa-da idmi, nädip düşünmeli? Klas, web sahypasynda gaýtalanylýan elementler üçin berilýär (birnäçe gezek bir CSS kodyny ýazmaslykdan gaça durmak üçin). Hatta häzir bu element bir bolsa hem, size mysaly elementleriň geljekde peýda bolup biler diýip duýýan bolsaňyz - bu elemente klas beriň. Eger size şeýle element biri-birini meňzeş däl - diýen işiniz bolsa, onda oňa id beriň. Häzirki wagtda hemme elementlere klas bermek we id-ni JavaScript üçin ýat saklamak meýli bar, ýöne bu ýörelge häli hemme ýerde kabul edilmedik.

Elemente birnäçe klas bellenip bilner, bu ýagdaýda olar boşluk arkaly sanawlanmaly.

Klaslaryň atlary iňlis elipbiýi, sanlar bilen ýazylyp, boşluk bolmaly däl (boşluk klaslary bir-birinden aýyrýar, onuň ýerine aşaky siziş ýa-da defis ulanyp bolýar). Klaslar san bilen başlamaly däl (HTML5-da artyk mümkin, ýöne köne brauzerlerde işlemez).

Klaslaryň atlary iňlis dilinde berilmeli (iňlis dilinde däl-de, diňe iňlis harp bilen!). Atlar manyly bolmaly, klaslaryň mazmunyny aňladyp görkezmeli.

Mysal

Geliň, klas test bellenen ähli abzaslara tekstiň gyzyl reňkini bellaýalyň:

<p class="test">Klas test bilen abzas.</p>
<p>Klassy bolmadyk kontrol abzasy.</p>

.test {
	color: red;
}

Mysal . Element üçin birnäçe klas

Bu ýerde bolsa, birinji abzasa birnäçe klas bellaýalyň - test1 we test2 (olary boşluk arkaly ýazaýalyň). Klas test1 gyzyl tekstiň reňkini bellaýar, klas test2 bolsa şriftiň ululygyny 20px belläp berýär. Ikinji abzasa diňe klas test1 berildi (bu abzas gyzyl bolar), üçünji abzasa - klas test2 (bu abzas şrift ululygyny 20px bolup görkezer). Iki klasy bolan birinji abzas, bir wagtda hem gyzyl reňkli hem şrift ululygy 20px bolar:

<p class="test1 test2">Test1 we test2 klassy bilen abzas.</p>
<p class="test1">Test1 klassy bilen abzas.</p>
<p class="test2">Test2 klassy bilen abzas.</p>
<p>Klassy bolmadyk kontrol abzasy.</p>

.test1 {
	color: red;
}
.test2 {
	font-size: 20px;
}

Şeýle-de görüň

atribut id,
elementlere biri-birini meňzeş bolmadyk şahsy identifikasiýa belgilerini bellaýar