Klasslar
HTMLning class atributi HTML elementlarini sinflarga ajratish uchun ishlatiladi. Bir nechta elementlar bir xil class nomga ega bo'lishi mumkin.
Class ni sinf deb atash o'zbek dasturchilar o'rtasida tarqalmagani va o'zbek auditoriyasida ham class deb tanilgani sababli mavzularni tarjima qilishda sinf so'zi ishlatimaydi.
class attributidan foydalanish
class attributidan foydalanishClass atributi ko'pincha CSS-da class nomini ko'rsatish uchun ishlatiladi. Bundan tashqari, u class-ga ega elementlarga JavaScript orqali tasir qilish va ularni boshqarish uchun ishlatilishi mumkin.
Quyida "city" nomli class atributlari mavjud bo'lgan 3ta <div> elementini misol qilib keltirdik. Barcha 3-ta <div> elementlarining stillari <head> qismdagi city ga berilgan stillarga teng bo'ladi.
<!DOCTYPE html>
<html>
<head>
<style>
.city {
background-color: tomato;
color: white;
border: 2px solid black;
margin: 20px;
padding: 20px;
}
</style>
</head>
<body>
<div class="city">
<h2>London</h2>
<p>London is the capital of England.</p>
</div>
<div class="city">
<h2>Paris</h2>
<p>Paris is the capital of France.</p>
</div>
<div class="city">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan.</p>
</div>
</body>
</html> 
Quyida "note" nomli class atributlari mavjud bo'lgan 2ta <span> elementini misol qilib keltirdik. Barcha 2-ta <span> elementlarining stillari <head> qismdagi .note ga berilgan stillarga teng bo'ladi.
Maslahat: class atributidan har qanday HTML elementida foydalanish mumkin.
Eslatma: Class nomi katta kichik harfga qarab farq qiladi
Maslahat: Bizning CSS o'quv qo'llanmamiz orqali CSS hqida ko'proq narsa o'rganishingiz mumkin
Class uchun sintaksis
CSS orqali class ga murojaat qilish uchun (.) nuqtadan keyin class nomini yozing keyin jingalak {} qavslar ichida CSS xususiyatlarini berishingiz mumkin.
Bir nechta classlar
HTML elementlari bir nechta classlarga ega bo'lishi mumkin.
Bir nechta class berish uchun class nomlarini bo'sh joy bilan ajratib yozing, misol uchun <div class="city main">. Element o'ziga berilgan barcha classlarga tegishli stillarni oladi.
Ushbu misoldagi bitinchi <h2> elementi city hamda main classlariga ega va u ikkala classga berilgan stillarni ham oladi:
Turli elementlar bir xil classga ega bo'la oladi
Ushbu misoldagi <h2> va <p> elementlari "city" nomli bir xil class-ga va bir xil stillga ega bo'lishadi:
Javascriptda class atributidan foydalanish
Class nomlari JavaScript orqali ma'lum bir elementlar ustida turli vazifalarni amalga oshirish uchun ham ishlatilishi mumkin.
JavaScriptning getElementsByClassName() metodi orqali ma'lum bir classga ega elementlarga tasir o'tkazishi mumkin:
Xulosa
HTMLning
classatributi element uchun bir yoki bir nechta class nomini belgilaydiClasslar CSS va Javascript orqali elementlarni tanlash va ularni boshqarish uchun ishlatiladi
Istalgan HTML elementda
classatributidan foydalanish mumkinClass nomi, harfning katta kichikligiga qarab farq qiladi
Turli HTML elementlari bir xil class nomiga ega bo'lishi mumkin
JavaScriptning
getElementsByClassName()metodi orqali ma'lum bir classga ega elementlarga murojaat qilish mumkin
Last updated