Pagkat-on mahitungod sa Nanguna sa Disenyo sa Web

Ang laraw sa web kanunay nangutang sa mga prinsipal ug mga kahulogan gikan sa kalibutan sa graphic ug print design. Tinuod kini ilabi na kon mahitungod sa typography sa web ug sa paagi nga kita adunay mga sulat sa atong mga web pages. Kini nga parallels dili kanunay 1 ngadto sa 1 nga mga hubad, apan mahimo nimo nga makita kung diin ang usa ka pagdisiplina nakaimpluwensya sa lain. Makita kini ilabi na kung imong ikonsiderar ang relasyon tali sa tradisyonal nga typography nga termino nga "nanguna" ug ang property nga CSS nga gitawag nga "taas nga linya."

Ang Katuyoan sa Nangulo

Sa diha nga ang mga tawo gigamit sa pag-handset sa metal o kahoy nga mga letra aron mahimo ang typography alang sa usa ka giimprinta nga panid, ang manipis nga mga piraso sa tingga gibutang sa taliwala sa pinahigda nga mga linya sa teksto aron sa paghimo sa gilay-on tali sa mga linya. Kung gusto nimo ang usa ka mas dako nga luna, ikaw makahimo sa pagsulod sa dagko nga mga piraso sa tingga. Kini ang paagi nga ang termino nga "nanguna" gimugna. Kon imong gitan-aw ang termino nga "nagapanguna" sa usa ka basahon mahitungod sa disenyo sa mga typographic ug mga prinsipal, mabasa niini ang usa ka butang sa epekto - "ang gilay-on tali sa baselines sa sunod-sunod nga mga linya sa tipo."

Nanguna sa Web Design

Sa digital nga disenyo, ang gigikanan nga termino gigamit gihapon sa pagtumong sa gilay-on tali sa mga linya sa teksto. Daghang mga programa ang nagagamit niini nga eksakto nga termino, bisan tuod ang tinuod nga tingga klaro nga wala gigamit sa maong mga programa. Kini usa ka maayong pananglitan sa bag-ong mga porma sa pagdesinyo sa pagplano gikan sa mga tradisyonal nga mga butang, bisan pa ang tukmang pagpatuman sa maong prinsipyo nausab.

Sa pag-abut sa web design, walay CSS nga kabtangan alang sa "nanguna." Hinunoa, ang propiedad sa CSS nga magdumala niining visual display sa teksto gitawag nga taas nga linya. Kung gusto nimo ang imong teksto adunay dugang nga luna tali sa pinahigda nga linya sa teksto, imong gamiton kini nga kabtangan. Pananglitan, nag-ingon nga gusto nimo nga dugangan ang gitas-on nga linya alang sa tanang mga parapo sulod sa

elemento sa imong site , mahimo nimo kini:

main p {line-height: 1.5; }

Kini mahimong 1.5 ka beses sa gitas-on sa normal nga linya, base sa default nga sukod sa font sa panid (nga kasagaran 16px).

Kanus-a Gamiton ang Linya-Gitas-on

Ingon nga detalyado sa ibabaw, ang gitas-on nga linya angay nga gamiton ngadto sa luna ang mga linya sa teksto sa mga parapo o uban pang mga bloke sa teksto. Kon adunay gamay nga luna tali sa mga linya, ang teksto mahimo nga mapainubsanon ug lisud ang pagbasa alang sa mga tumatan-aw sa imong site. Sa susama, kon ang mga linya layo kaayo sa panid, ang normal nga pag-agas sa pagbasa mahunong ug ang mga magbabasa adunay problema sa imong teksto alang sa maong hinungdan. Mao kini ang hinungdan nga gusto nimo nga makit-an ang tukmang gidaghanon sa gitas-on nga gitas-on sa linya nga gamiton. Mahimo usab nimo sulayan ang imong desinyo uban sa mga aktwal nga tiggamit aron makuha ang ilang mga feedback sa mabasa sa pahina .

Kanus-a nga Dili Paggamit sa Linya-Gitas-on

Ayaw pagkalibog ang linya sa gitas-on uban ang padding o mga margin nga imong gamiton aron makadugang sa disenyo sa panid sa panid sa imong panid, lakip sa ubos nga ulohan o parapo. Kana nga gilay-on dili paingon, ug busa kini wala pagdumala sa gitas-on sa linya.

Kon gusto nimong idugang ang luna ubos sa pipila ka mga elemento sa teksto, mogamit ka og mga margin o padding. Pagbalik sa naunang CSS example nga among gigamit, mahimo namong dugangan kini:

main p {line-height: 1.5; giladmon-bottom: 24px; }

Kini adunay 1.5 ka gitas-on sa linya tali sa mga linya sa teksto alang sa paragraph sa among pahina (ang mga anaa sa sulod sa

elemento). Ang maong mga parapo adunay 24 ka pixel nga whitespace sa matag usa kanila, nga nagtugot alang sa mga visual break nga nagtugot sa mga magbabasa sa dali nga pag-ila sa usa ka parapo gikan sa lain ug paghimo sa pagbasa sa website nga mas sayon ​​buhaton. Mahimo usab nimo gamiton ang padding property sa dapit sa mga margin dinhi:

main p {line-height: 1.5; padding-bottom: 24px; }

Sa halos tanan nga mga kaso, kini gipakita nga susama sa kaniadtong CSS.

Ingna nga gusto nimong idugang ang gilay-on sa listahan sa mga butang nga anaa sa sulod sa usa ka lista sa usa ka klase sa "serbisyo-nga menu", mogamit ka og mga margin o padding aron mahimo, DILI ang gitas-on sa linya. Busa kini angay.

.services-menu li { Mahimo ka lamang maggamit sa linya nga gitas-on dinhi kung buot nimo nga ibutang ang gilay-on sa teksto sulod sa lista-mga butang sa ilang mga kaugalingon, nga nagtuo nga sila adunay taas nga pagdagan sa teksto nga mahimong modagan sa daghang linya alang sa matag punto sa bala.