Mga Line Up Up Gamit ang CSS Text Align Property

Mga Line Up Up Gamit ang CSS Text Align Property

Ang isa sa mga unang tampok na natutunan ng lahat ng mga developer tungkol sa kung kailan makakakuha ng grip sa pagpoproseso ng salita ay pagkakahanay ng teksto. Ang maliliit na tool na iyon ay mahalaga para sa mga propesyonal na typetter at amateur flyer na disenyo. Hindi nakakagulat na may suporta ang CSS para sa pagkakahanay ng teksto pagdating sa disenyo ng web.





Ang text-align ang pag-aari, kasama ang isa o dalawa pang iba, ay kumokontrol kung paano pahalang na pinapantay ng isang elemento ang teksto nito. Higit pa sa mga pangunahing kaalaman, ang mga browser ay dahan-dahang nagpapatupad ng higit pa sa detalye, ngunit magkakaiba ang buong suporta. Alamin kung paano ihanay ang teksto at aling mga tampok ang sinusuportahan ng mga karaniwang browser ngayon.





Ang Mga Pangunahing Kaalaman sa pag-aari ng text-align na CSS

Ang pagkakahanay ay isa sa mga pinaka pamilyar na termino ng palalimbagan. Sa konteksto ng CSS, text-align tumutukoy sa pahalang na pagkakahanay.





Nalalapat lamang ang pahalang na pagkakahanay ng teksto sa mga lalagyan ng block. Ito ang mga elemento ng buong lapad tulad ng mga talata at div. Gamit ang text-align pag-aari sa isang sangkap na naka-linya tulad ng sa walang epekto. Maaari mo ring ihanay ang mga item sa listahan at mga cell ng talahanayan:

maaari mong ayusin ang isang patay pixel

Bilang default, sa isang kaliwa-sa-kanan na wika (higit pa rito sa paglaon), ang teksto ay nakahanay sa kaliwa:



Sa CSS, pareho ito sa:

p { text-align: left; }

O:





p { text-align: start; }

Kaugnay: Ano ang Mga Cascading Style Sheet at Ano ang Ginagamit Para sa CSS?

Maaari mong gamitin ang iba pang mga halaga para sa text-align ari-arian upang baguhin ang pahalang na pagkakahanay. Ang mga pinaka-karaniwang halaga ay pamilyar mula sa mga word processing app:





text-align: left
text-align: center
text-align: right

Gumamit ng Katwiran upang Ihanay ang Kaliwa at Kanan na mga Mataas

Isa pang karaniwang halaga para sa text-align ay bigyan ng katwiran . Nagdagdag ng mga puwang ang mga browser sa makatarungang teksto upang ang bawat linya ay umabot upang punan ang magagamit na puwang:

Kapag binigyan mo ng katwiran ang teksto, ang panghuling linya ay maaaring maging nakakalito. Dahil maaaring ito ay masyadong maikli (marahil ay isang solong salita lamang), ang pagpapalawak nito sa buong lapad ay maaaring maging pangit. Bilang default, kahit na ang makatarungang teksto ay ihanay ang huling linya sa kaliwa.

hp laptop fan ingay windows 10

Maaaring gusto mo minsan ng ibang epekto. Ang pagpapatupad ng browser ay nakakakuha ng detalye, ngunit posible ang dalawang diskarte.

Ang justify-all Ang ibig sabihin ng halaga ay nangangahulugang tinatrato ng mga browser ang panghuling linya tulad ng lahat ng iba pa, at iniunat ito sa buong lapad. Gayunpaman, sa oras ng pagsulat na ito, walang browser ang sumusuporta sa halagang ito. Kaya mo suriin ang caniuse upang makita kung ginagawa nila kapag binabasa mo ang artikulong ito.

Isa pang pag-aari ng CSS, text-align-last , ay mas may kakayahang umangkop at may mas mahusay na suporta. Maaari mo itong gamutin nang higit pa o mas kaunti sa parehong text-align , ngunit nalalapat lamang ito sa huling linya:

Ang suporta ng browser para sa pag-aari na ito ay mas mahusay, ngunit hindi perpekto. Muli, suriin ang caniuse bago mo ito gamitin . Kung hindi kilalanin ng isang browser ang pag-aari na ito, hindi ito papansinin nito.

Paghanay ng Teksto at Direksyon sa Pagbasa

Maaaring nagtatrabaho ka sa isang wika, tulad ng Arabe o Hebrew, na nagbabasa mula kanan hanggang kaliwa. Ginagamit ng CSS ang direksyon ari-arian upang tukuyin ito, halimbawa:

direction: rtl;

Ang mga wikang ito ay karaniwang nakahanay ng teksto sa kanan bilang default.

Sa halip na tukuyin umalis na / tama , ang ginustong paraan upang ihanay ang teksto ay gumagamit ng mga halaga umpisahan at magtapos . Tinutukoy nito kung dapat na pumila ang teksto sa simula ng bawat linya o sa dulo. Sa kaliwa-sa-kanan na mga wika, umpisahan ay katumbas ng umalis na . Sa isang kanan-sa-kaliwang wika, ang teksto ay nagsisimula sa kanan at nagtatapos sa kaliwa.

Ang server ip address ay hindi matagpuan.

Gamit umpisahan o magtapos nangangahulugan na, anuman ang direksyon ng teksto, ang pagkakahanay ay pare-pareho.

Paano Pinagmamana ng Mga Elemento ang Pag-aari ng text-align

Dapat mong magkaroon ng kamalayan na ang text-align pagmamay-ari ng pag-aari. Halimbawa, kung itinakda mo ito sa katawan elemento, mailalapat ito sa bawat elemento sa pahina. Maaari mong, siyempre, i-override ito sa anumang elemento.

Gamit ang pag-aari ng text-align sa Control to Layout

Maaari mong gamitin ang text-align Pag-aari ng CSS upang tukuyin kung paano inilalagay ng mga browser ang teksto nang pahalang. Ang pinakakaraniwang mga halaga ay umalis na , tama , gitna , at bigyan ng katwiran . Ito ay medyo prangka, bagaman bigyan ng katwiran nagpapakilala ng ilang pagiging kumplikado.

Dapat mong matiyak na gumamit ng pagkakahanay ng teksto. Sa mga billboard at poster, maaaring angkop ang pag-align ng gitnang, ngunit maaari nitong gawing mahirap basahin ang mga mahahabang bloke ng teksto. Ang pagbibigay-katwiran ay karaniwang mas nababasa kapag ang mga linya ng teksto ay mas mahaba. Ang pagbibigay-katwiran sa mga maikling haligi ng teksto ay maaaring lumikha ng pangit na puwang.

Ang text-align ang pag-aari ay isa sa maraming mga pag-aari ng CSS na nagbibigay ng kapaki-pakinabang na pag-format at pangunahing pagpoposisyon.

Magbahagi Magbahagi Mag-tweet Email 10 Mga Simpleng Halimbawa ng CSS Code na Maaari Mong Malaman sa loob ng 10 Minuto

Kailangan mo ng tulong sa CSS? Subukan ang mga pangunahing halimbawang CSS code upang magsimula, pagkatapos ay ilapat ang mga ito sa iyong sariling mga web page.

Basahin Susunod
Mga Kaugnay na Paksa
  • Programming
  • Pag-unlad sa Web
  • Disenyo ng web
  • CSS
Tungkol sa May-akda Bobby Jack(58 Mga Artikulo Na-publish)

Si Bobby ay isang mahilig sa teknolohiya na nagtrabaho bilang isang developer ng software sa loob ng halos dalawang dekada. Masigasig siya sa paglalaro, nagtatrabaho bilang Review Editor sa Switch Player Magazine, at nahuhulog sa lahat ng aspeto ng online na pag-publish at pag-unlad sa web.

Higit pa Mula kay Bobby Jack

Mag-subscribe sa aming newsletter

Sumali sa aming newsletter para sa mga tip sa tech, pagsusuri, libreng ebook, at eksklusibong deal!

Mag-click dito upang mag-subscribe