HTML Block va Inline Elementlari

HTML Block va Inline Elementlari


HTMLdagi har bir elementining turiga qarab standart ko’rinish qiymati bo’ladi. Ko’p elementlar uchun standard ko’rsatsh qiymati block yoki inline.


Block-level Elementlari

Block-level elementlari har doim yangi qatordan boshlanib mavjud bo'lgan joygacha to'ladi.(Chapdan o'nggacha barcha bo'sh joyni to'ldiradi)

The <div> elementi block-level elementi hisoblanadi.

Block-level elementlariga namunalar:

  • <div>
  • <h1> - <h6>
  • <p>
  • <form>

Inline Elementlari

An inline elementi yangi qatordan boshlanmaydi va kerakli kenglikkacha yoziladi.

Bu paragraf ichidagi inline <span> elementi

Inline elementlariga misollar

  • <span>
  • <a>
  • <img>

<div> Elementi

<div> elementi block-level elementi hisoblanadi va boshqa HTML elementlari konternerlari sifatida ishlatiladi

<div> elementi uchun attributlar shart emas lekin ko’rinish va klasslar umumiy

div> elementi css bilan birgalikda ishlatilganda ma’lum bir block elementini ko’rinishini ifodalaydi

Namuna:

<div style="background-color:black; color:white; padding:20px;">

<h2>Inha Universiteti</h2>
<p>Toshkent shahridagi Inha universitetining asosiy vazifasi jamiyat va millat taraqqiyoti uchun, yurtimizda axborot texnologiyalar sohasining rivoji uchun o'z hissasini qo'sha oladigan, yuqori malakali, har tomonlama barkamol mutahassislarni yetkazib berishdan iborat.</p>
<p>IUT oldiga qoygan ustivor vazifani oqlash maqsadida bakavlariat va magistrlik yo'nalishlari bo'yicha tahsil  olayotgan talabalar halqaro standartlar asosida ilm olish imkoniyatiga ega bo'ladilar</p> 

</div>

<span> Elementi

<span> elementi bir miqdorda matnni o’z ichiga olgan inline elementi hisoblanadi.

<span> elementi uchun attributlar shart emas lekin ko’rinish va classlar umumiy

<span> elementi css bilan birgalikda ishlatilganda ma’lum bir matn elementini ko’rinishini ifodalaydi

Namuna:

<h1>My <span style="color:red">Important</span> Heading</h1>

HTML Guruhlash Teglari

Teg Izohlar
<div> (block-level) hisoblanadi
<span> (inline) hisoblanadi

Innovative Lab web sahifasiga xush kelibsiz biz bilan birga IT sohasidagi o'z bilimlaringizni bosqichma-bosqich oshirib boring!


Telegram kanalimizdan kunlik darslarni o'rganing  

TOSHKENT SHAHRIDAGI INHA UNIVERSITETI - 2017