Gamit ang CSS Line-Height Property upang makakuha ng CSS Line Spacing
Alamin kung paano gamitin ang line-height ng estilo ng estilo ng CSS upang maapektuhan ang iyong spacing ng linya sa iyong mga pahina sa Web.
Mga Halaga ng Spacing ng Line ng CSS
Ang spacing ng linya ng CSS ay apektado ng estilo ng CSS estilo ng linya ng taas. Ang ari-arian na ito ay tumatagal ng hanggang 5 iba't ibang mga halaga:
- normal: tinutukoy ng browser ang isang halaga para sa spacing ng linya na may kaugnayan sa laki ng font. Ito ay karaniwang katulad ng laki ng font o bahagyang mas malaki (tulad ng 20%).
- magmana: dapat na kinuha ang line spacing mula sa line spacing ng elemento ng magulang. Kaya kung itatakda mo ang line-height ng iyong katawan tag sa 30% na mas malaki kaysa sa laki ng font at ang mga tag ng talata sa loob na nakatakda upang magmana, magkakaroon din sila ng isang linya-taas ng 30% na mas malaki kaysa sa laki ng font.
- isang numero: Kung ang halaga ng taas ng linya ay walang yunit ng sukat, ito ay itinuturing na isang multiplier sa laki ng font para sa taas ng linya. Kaya ang isang line-height ng 1.25 ay 25% na mas malaki kaysa sa laki ng font.
- isang haba: Kung ang halaga ng line-height ay may yunit ng panukalang-batas, iyon ay ang eksaktong dami ng puwang na dapat ay nasa pagitan ng mga linya. Kaya, 1.25mm ay magreresulta sa mga linya ng 1.25 millimeters hiwalay.
- isang porsyento: Kung ang line-height ay isang porsyento, iyon ay isang porsyento ng laki ng font. Kaya ang isang line-height ng 125% ay 25% na mas malaki kaysa sa laki ng font.
Aling Halaga ang Dapat Mong Gamitin para sa Spacing ng Line ng CSS
Sa karamihan ng mga kaso, ang pinakamahusay na pagpipilian para sa spacing ng linya ay iwanan ito sa default - o "normal". Ito ay karaniwang ang pinaka nababasa at hindi nangangailangan na gumawa ka ng anumang bagay na espesyal. Ngunit ang pagpapalit ng line spacing ay maaaring magbigay sa iyong teksto ng ibang pakiramdam dito.
Kung ang iyong laki ng font ay tinukoy bilang ems o porsyento, ang iyong linya-taas ay dapat ding tinukoy na paraan. Ito ang pinaka-nababaluktot na porma ng spacing ng linya dahil pinapayagan nito ang mambabasa na baguhin ang kanilang mga font at pinapanatili ang parehong ratio sa spacing ng iyong linya.
Itakda ang taas ng linya para sa mga estilo ng naka-print na sheet na may puntong (pt) na halaga. Ang punto ay isang panukalang naka-print, at kaya ang laki ng iyong font ay dapat na nasa mga punto rin.
Hindi ko nais na gamitin ang numero ng pagpili dahil nakita ko na ito ay pinaka nakalilito sa mga tao. Maraming mga tao ang nag-iisip na ang bilang ay isang ganap na sukat, at kaya nila itong napakalaki. Halimbawa, maaari kang magkaroon ng isang font na nakatakda sa 14px at pagkatapos ay itakda mo ang iyong line-height sa 14 - na nagreresulta sa mga malaking puwang sa pagitan ng mga linya - dahil ang line spacing ay naka-set sa 14 na beses sa laki ng font.
Gaano Karaming Space Dapat mong Gamitin para sa Iyong Line Spacing
Tulad ng nabanggit ko sa itaas, inirerekumenda ko ang paggamit ng default na spacing ng linya maliban kung mayroon kang isang tiyak na dahilan upang baguhin ito. Ang pagbabago ng line spacing ay maaaring magkaroon ng iba't ibang epekto:
- Ang teksto na masikip magkasama ay maaaring mahirap basahin. Ngunit ang mga maliliit na linya ng linya ay maaaring makaapekto sa mood ng teksto. Kung ang teksto ay naka-scrunched magkasama ito ay maaaring gumawa ng mga kahulugan ng teksto ang tila mas madidilim o higit pa panahunan.
- Ang teksto na mas malayo ay maaaring mahirap basahin. Ngunit ang malawak na mga linya ng linya ay gumagawa ng teksto na tila mas dumadaloy at likido.
- Ang pagpapalit ng spacing ng linya ay maaaring gumawa ng teksto na kung saan ay hindi magkasya sa espasyo maging mas compact o tumagal ng higit na espasyo sa iyong mga disenyo.