HTML blok va inline elementlar
Har bir HTML elementning standart ko‘rsatish (display) qiymati bor, u qaysi turdagi elementga bog‘liq.
Ikkita eng ko‘p ishlatiladigan display qiymatlari bu block va inline.
Blok-darajadagi elementlar
Blok darajasidagi element doim yangi satrdan boshlanadi va brauzerlar elementdan oldin va keyin avtomatik ravishda bir oz bo‘sh joy (margin) qo‘shadi.
Blok darajasidagi element doim mavjud bo‘lgan butun kenglikni egallaydi (chapga va o‘ngga imkon qadar cho‘ziladi).
Ikkita ko‘p ishlatiladigan blok elementlari: <p>
va <div>.
<p> elementi HTML hujjatida paragrafni belgilaydi.
<div> elementi HTML hujjatida bo‘linma yoki
bo‘limni belgilaydi.
<p> elementi — blok darajasidagi element.
Bu yerda HTML dagi blok darajasidagi elementlar keltirilgan:
Inline elementlar
Inline element yangi satrdan boshlanmaydi.
Inline element faqat zarur bo‘lgancha kenglikni egallaydi.
Bu paragraf ichidagi <span> elementi namunasidir.
Bu yerda HTML dagi inline elementlar keltirilgan:
Eslatma: Inline element blok darajasidagi elementni o‘z ichiga ololmaydi!
<div> elementi
<div> elementi ko‘pincha boshqa HTML elementlari uchun konteyner sifatida ishlatiladi.
<div> elementining majburiy atributlari yo‘q, lekin style, class va id keng tarqalgan.
CSS bilan birga ishlatilganda, <div> elementi kontent bloklariga uslub berish uchun ishlatilishi mumkin:
Misol
<div style="background-color:black;color:white;padding:20px;">
<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>
O‘zingiz sinab ko‘ring »
<div> elementi haqida keyingi bobda ko‘proq o‘rganasiz.
<span> elementi
<span> elementi matnning bir qismini yoki hujjatning bir qismini belgilash uchun ishlatiladigan inline konteynerdir.
<span> elementining majburiy atributlari yo‘q, lekin style, class va id keng tarqalgan.
CSS bilan birga ishlatilganda, <span> elementi matn qismlariga uslub berish uchun ishlatilishi mumkin:
Misol
<p>My mother has <span style="color:blue;font-weight:bold;">blue</span> eyes
and my father has <span style="color:darkolivegreen;font-weight:bold;">dark
green</span> eyes.</p>
O‘zingiz sinab ko‘ring »
Bob xulosasi
- Blok darajasidagi element doim yangi satrdan boshlanadi va mavjud bo‘lgan butun kenglikni egallaydi
- Inline element yangi satrdan boshlanmaydi va faqat zarur bo‘lgancha kenglikni egallaydi
<div>elementi blok darajasidagi element bo‘lib, ko‘pincha boshqa HTML elementlari uchun konteyner sifatida ishlatiladi<span>elementi matnning bir qismini yoki hujjatning bir qismini belgilash uchun ishlatiladigan inline konteynerdir
HTML teglari
| Tag | Tavsif |
|---|---|
| <div> | Hujjatdagi bo‘limni belgilaydi (blok darajasidagi) |
| <span> | Hujjatdagi bo‘limni belgilaydi (inline) |
Barcha mavjud HTML teglarining to‘liq ro‘yxati uchun HTML teglar ma’lumotnomamizga murojaat qiling.
Video: HTML blokli va satr ichidagi elementlar
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!