Поравнање текста - ЦСС-трикови

Anonim

text-alignИмовина у ЦСС се користи за усклађивање унутрашњег садржаја блок елемента.

p ( text-align: center; )

Ово су традиционалне вредности за поравнање текста:

  • left- Подразумевана вредност. Садржај се поравнава дуж леве стране.
  • right - Садржај се поравнава уз десну страну.
  • center- Центри садржаја између леве и десне ивице. Размак на левој и десној страни сваке линије треба да буде једнак.
  • justify - Простори са садржајем су такви да што више блокова стане у једну линију, а прва реч на тој линији налази се уз леву ивицу, а последња реч поред десне ивице.
  • inherit - Вредност ће бити која год да је надређени елемент.

Овде се „Садржај“ користи као појам уместо као „текст“, јер иако поравнање текста сигурно утиче на текст, оно утиче на све уграђене елементе или блок-блок елементе у том спремнику.

Постоје и две нове вредности у ЦСС3, почетак и крај. Те вредности олакшавају подршку више језика. На пример, енглески је језик слева надесно (лтр), а арапски језик здесна налево (ртл). Коришћење „десно“ и „лево“ за вредности је превише круто и не прилагођава се смеру промене. Ове нове вредности се прилагођавају:

  • start - Исто као „лево“ у лтр, исто као „десно“ у ртл.
  • end - Исто као „десно“ у лтр, исто као „лево“ у ртл.

Такође постоји match-parent, што је слично inherit, само што се нова вредност израчунава према смеру тренутног елемента уместо да, знате, то не радите.

У спецификацији постоји неколико ствари које још немају подршку за прегледач. Једна је вредност „старт енд“ која би поравнала први ред као да је „старт“, а све наредне редове као да је „крај“. Друго је давање вредности низу, на пример text-align: "." start;Текст ће се прилагодити првом појављивању тога, као у поравнању колоне бројева дуж децималне тачке.

Примери

Овај текст је поравнат улево.

Овај текст је поравнат удесно.

Усредсређен сам!

Оправдана сам. Тачно попуњавам простор (осим на последњем реду), чак иако понекад морам мало да се истегнем.

Наслеђујем поравнање свог родитеља. У овом случају то значи лево.

Подршка прегледача

За лево, десно, центар оправдајте:

Хром Сафари Фирефок Опера ИЕ Андроид иОС
Било који Било који Било који 3.5+ 3+ Било који Било који

За startи endвредности:

Хром Сафари Фирефок Опера ИЕ Андроид иОС
Било који 3.1+ 3.6+ Ниједан Ниједан Било који Било који