search

Klasslar

HTMLning class atributi HTML elementlarini sinflarga ajratish uchun ishlatiladi. Bir nechta elementlar bir xil class nomga ega bo'lishi mumkin.

circle-exclamation

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.

hashtag
class attributidan foydalanish

Class 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>
LogoW3Schools online HTML editorwww.w3schools.comchevron-right

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.

LogoW3Schools online HTML editorwww.w3schools.comchevron-right
circle-exclamation

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

hashtag
Class uchun sintaksis

CSS orqali class ga murojaat qilish uchun (.) nuqtadan keyin class nomini yozing keyin jingalak {} qavslar ichida CSS xususiyatlarini berishingiz mumkin.

LogoW3Schools online HTML editorwww.w3schools.comchevron-right

hashtag
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:

LogoW3Schools online HTML editorwww.w3schools.comchevron-right

hashtag
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:

LogoW3Schools online HTML editorwww.w3schools.comchevron-right

hashtag
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:

hashtag
Xulosa

  • HTMLning class atributi element uchun bir yoki bir nechta class nomini belgilaydi

  • Classlar CSS va Javascript orqali elementlarni tanlash va ularni boshqarish uchun ishlatiladi

  • Istalgan HTML elementda class atributidan foydalanish mumkin

  • Class 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

PreviousDiv elementiNextSemantika

Last updated