CSS Text Align

...

CSS text align

Ushbu bobda quyidagi xususiyatlar haqida o'rganasiz:

  • text-align
  • text-align-last
  • direction
  • unicode-bidi
  • vertical-align

text-align xususiyati matnning gorizontal tekisligini belgilash uchun ishlatiladi.

Matn chap yoki o'ngga tekislangan, markazga joylashtirilgan yoki to'liq tekislangan bo'lishi mumkin.

Quyidagi misolda markazga joylashtirilgan, chap va o'ngga tekislangan matn ko'rsatilgan (agar matn yo'nalishi chapdan o'ngga bo'lsa, chapga tekislash standart hisoblanadi; agar matn yo'nalishi o'ngdan chapga bo'lsa, o'ngga tekislash standart hisoblanadi):

Misol

h1 {
  text-align: center;
}
 
h2 {
  text-align: left;
}
 
h3 {
  text-align: right;
}

text-align xususiyati "justify" ga o'rnatilganda, har bir qator kengaytiriladi, shunda har bir qatorning kengligi teng bo'ladi va chap va o'ng chekkalar tekis bo'ladi (jurnallar va gazetalar kabi):

Misol

div {
  text-align: justify;
}

Matnning Oxirgi Qatorini Tekislashtirish

text-align-last xususiyati matnning oxirgi qatorini qanday tekislashni belgilaydi.

Misol

Matnning oxirgi qatorini uchta <p> elementida tekislashtiring:

p.a {
  text-align-last: right;
}
 
p.b {
  text-align-last: center;
}
 
p.c {
  text-align-last: justify;
}

Matn Yo'nalishi

direction va unicode-bidi xususiyatlari elementning matn yo'nalishini o'zgartirish uchun ishlatilishi mumkin:

Misol

p {
  direction: rtl;
  unicode-bidi: bidi-override;
}

Vertikal Tekislik

vertical-align xususiyati elementning vertikal tekisligini belgilaydi.

Misol

Matn ichidagi rasmning vertikal tekisligini o'rnating:

img.a {
  vertical-align: baseline;
}
 
img.b {
  vertical-align: text-top;
}
 
img.c {
  vertical-align: text-bottom;
}
 
img.d {
  vertical-align: sub;
}
 
img.e {
  vertical-align: super;
}

CSS Matnni Tekislashtirish/Yo'nalish Xususiyatlari

XususiyatTavsif
directionMatn yo'nalishini/yazish yo'nalishini belgilaydi
text-alignMatnning gorizontal tekisligini belgilaydi
text-align-lastMatnning oxirgi qatorini qanday tekislashni belgilaydi
unicode-bididirection xususiyati bilan birga ishlatiladi, matnni turli tillarda qo'llab-quvvatlash uchun o'zgartirilishi kerakligini belgilaydi
vertical-alignElementning vertikal tekisligini belgilaydi

Ushbu sahifada

GitHubda tahrirlash