W3SCHOOLS
  • Dasturlashni dunyodagi eng katta dasturchilar saytidan o'rganing
  • HTML
    • Boshlash
      • Tanishuv
      • Editorlar
      • Boshlang'ich
      • Elementlar
      • Atributlar
      • Headinglar
      • Paragraflar
      • Style
      • Formatlash
      • Iqtiboslar
      • Izohlar
      • Ranglar
        • RGB
        • HEX
        • HSL
      • CSS
      • Havolalar
        • Havola ranglari
        • Havola bookmarklari
      • Rasmlar
        • Rasmlar
        • Rasm xaritalari
        • Orqafon rasmlar
        • Picture elementi
      • Favicon
      • Sahifa sarlavhasi
      • Ro'yxatlar
        • Tartiblanmagan ro'yxat
        • Tartiblangan ro'yxat
        • Tarifli ro'yxatlar
      • Block & Inline
      • Div elementi
      • Klasslar
      • Semantika
  • CSS
    • CSS qo'llanma
      • CSS HOME
      • CSS Tanishuv
      • CSS Sintaksis
      • CSS Selektorlar
      • CSS qanday qo'shiladi
      • CSS Izohlar
      • CSS Ranglar
        • RGB
        • HEX
        • HSL
      • CSS Matn
        • Matn ranggi
        • Matn joylashuvi
        • Text decoration
        • Text transform
        • Matn oralig'i
        • Text shadow
      • CSS Backgroundlar
        • Background color
        • Background image
        • Background repeat
        • Background attachment
        • Background shorthand
    • CSS Borderlar
      • Chegara kengligi
      • Chegara rangi
      • Chegara tomonlari
      • Border qisqarmasi
      • Yumaloq chegaralar
    • CSS Marginlar
      • Margin collapse
    • CSS Padding
    • CSS Width/Height
Powered by GitBook
On this page
  • HTML Paragraflar
  • Ekranda ko'rsatilishi
  • Horizontal rule
  • HTML Qatorni tugatish
  • She'r muammosi
  • Yechim - HTMLning <pre> elementi
  1. HTML
  2. Boshlash

Paragraflar

Paragraf har doim yangi qatordan boshlanadi va odatda matnning bloki bo'ladi.

PreviousHeadinglarNextStyle

Last updated 1 year ago

HTML Paragraflar

HTMLda <p> elementi paragrafni ifodalaydi.

Paragraflar har doim yangi qatordan boshlanadi va brauzerlar avtomatik tarzda paragrafning tepa va pastki qismiga boʻsh joy (margin) qoʻshadi.

<p>Bu paragraf.</p>
<p>Bu boshqa paragraf.</p>

Ekranda ko'rsatilishi

Kod ekranda qanday ko'rsatilishini aniq bila olmaysiz.

Katta yoki kichik ekranlarda va o'lchami o'zgartirilgan ekranlarda natijalar har xil bo'ladi.

HTML dagi kodingizga qo'shimcha bo'sh joylar yoki qo'shimcha qatorlar qo'shish orqali uning ko'rinishini o'zgartira olmaysiz.

Sahifa brauzerda ko'rsatilganida, brauzer avtomatik tarzda qo'shimcha bo'sh joylarni va qatorlarni olib tashlaydi:

<p>
Bu paragraf
bir nechta yangi qatorlarni
o'z ichiga oladi.
Ammo brauzer bunga 
e'tibor qilmaydi.
</p>

<p>
Bu paragraf
bir nechta     bo'sh    joylarni
o'z ichiga      oladi
ammo        brauzer
bunga e'tibor    qilmaydi
</p>

Horizontal rule

<hr> tegi HTML sahifada gorizontal uzun chiziq sifatida ko'rsatiladi.

<hr> elementi HTML sahifada kontentni ajratib turish uchun foydalaniladi.

<h1>Bu 1-sarlavha </h1>
<p>Bu bir matn.</p>
<hr>
<h2>Bu 2-sarlavha</h2>
<p>Bu boshqa bir matn</p>
<hr>

<hr> tegi bo'sh teg hisoblanadi, ya'ni unda yopiluvchi teg yo'q.

HTML Qatorni tugatish

HTMLda <br> elementi qatorni tugatishni ifodalaydi.

Agar yangi paragrafdan boshlamasdan qatorni to'xtatish (yangi qatorga o'tish)ni hohlasangiz <br> dan foydalaning.

<p>Bu<br>to'htatiluvchi satrli<br>paragraf</p>

She'r muammosi

Ushbu she'r ekranda bitta qatorda ko'rsatiladi:

<p>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</p>

Yechim - HTMLning <pre> elementi

HTMLdagi <pre> elementi formatlangan matnni ifodalaydi.

<pre>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</pre>

<pre> elementi ichidagi matn, belgilangan turdagi shriftda (odatda )da ko'rsatiladi va u bo'sh joyni ham yangi qatorlarni ham saqlaydi:

Courier
W3Schools online HTML editor
W3Schools online HTML editor
W3Schools online HTML editor
W3Schools online HTML editor
W3Schools online HTML editor
W3Schools online HTML editor
Logo
Logo
Logo
Logo
Logo
Logo