Darsliklar HTML <div>

HTML HTML <div>

<div> — kontentni guruhlash uchun ishlatiladigan universal konteyner teg. Uning o’zi hech qanday maxsus ko’rinish yoki ma’no bermaydi; u shunchaki elementlarni bir joyga jamlaydi. <div> — CSS va JavaScript bilan sahifa tuzilishini qurishning eng ko’p ishlatiladigan quroli.

<div> (division)blok-darajali, ma’nosiz konteyner teg. U kontentni guruhlash va CSS bilan bezash uchun ishlatiladi.

Oddiy foydalanish

<div> bir necha elementni bir guruhga jamlaydi:

<div>
    <h2>UzbekDevs</h2>
    <p>Dasturlashni o'rgatuvchi platforma.</p>
</div>
UzbekDevs
Dasturlashni o'rgatuvchi platforma.

<div> ichidagi sarlavha va paragraf bir guruh sifatida jamlandi. O’zi hech qanday vizual o’zgarish bermadi — u faqat idish vazifasini bajardi.

class va id bilan

<div> ning haqiqiy kuchi class va id atributlari bilan namoyon bo’ladi. Ular orqali CSS uslub yoki JavaScript amali qo’llanadi:

<div class="karta" id="mahsulot1">
    <h3>Telefon</h3>
    <p>Narxi: 12000000 so'm</p>
</div>
Telefon
Narxi: 12000000 so'm

class="karta" — bir necha bir xil elementga umumiy uslub berish uchun, id="mahsulot1" — bitta noyob elementni belgilash uchun. Bular CSS va JavaScript’ning <div> ga murojaat qilish yo’lidir.

div va semantik teglar

<div> ma’nosiz bo’lgani uchun, imkon bo’lsa semantik teglarni afzal ko’rish kerak. Farqni jadvalda ko’ramiz:

Teg Ma’nosi
<div> ma’nosiz konteyner
<header> sahifa boshi
<nav> navigatsiya
<article> mustaqil kontent
<footer> sahifa pasti

Agar bo’lakning aniq ma’nosi bo’lsa (bosh qism, navigatsiya), semantik tegni ishlating; shunchaki guruhlash kerak bo’lsa — <div>.

Qayerda ishlatiladi?

<div> sahifa maketini (layout) qurish, elementlarni CSS bilan joylashtirish (masalan, ustunlar, kartochkalar) va JavaScript bilan boshqarish uchun ishlatiladi. U eng ko’p uchraydigan HTML tegi. Biroq uni haddan tashqari ko’p ishlatmang — ma’noli joyda semantik teg tozaroq kod beradi.

Xulosa

Bu bo’limda <div> tegini, uni guruhlash uchun ishlatishni, class/id atributlarini va semantik teglar bilan farqini ko’rib chiqdik. <div> — universal, ammo ma’nosiz konteyner. Keyingi darsda <dl> tegiga o’tamiz.