Paano Magparehistro ang mga Paragraph sa CSS

Paggamit ng Text-Indent Property at Katabi ng mga Selection Selective

Ang magandang disenyo ng web ay kadalasang tungkol sa magandang palalimbagan. Dahil ang napakaraming nilalaman ng isang web page ay ipinakita bilang teksto, ang pagiging estilo na ang teksto ay kapwa kaakit-akit at mabisa ay isang mahalagang kakayahan upang magkaroon ng isang taga-disenyo ng web. Sa kasamaang-palad, wala kaming parehong antas ng pangkontrol na pag-type ng typographic na ginagawa namin sa pag-print. Nangangahulugan ito na hindi namin palaging mapagkakatiwalaan ang estilo ng teksto sa isang website sa parehong paraan na magagawa namin ito sa isang naka-print na piraso.

Ang isang karaniwang istilo ng talata na madalas mong nakikita sa pag-print (at kung saan maaari naming muling likhain sa online) ay kung saan ang unang linya ng talata na iyon ay naka-indent na isang tab na espasyo . Pinapayagan nito ang mga mambabasa na makita kung saan nagsisimula ang isang talata at nagwawakas ang isa pa.

Hindi mo nakikita ang estilo ng visual na ito sa mas maraming mga pahina ng web dahil ang mga browser, sa pamamagitan ng default, ay nagpapakita ng mga talata na may espasyo sa ilalim nito bilang isang paraan upang ipakita kung saan nagtatapos ang isa at nagsisimula ang isa pa, ngunit kung nais mong estilo ang isang pahina upang magkaroon ng print- inspirasyon ng indent style sa mga talata, maaari mong gawin ito sa estilo ng teksto-indent na ari-arian.

Ang syntax para sa ari-arian na ito ay simple. Narito kung paano mo magdagdag ng text-indent sa lahat ng mga talata sa isang dokumento.

p {text-indent: 2em; }

Pag-customize ng mga Indent

Ang isang paraan na maaari mong tukuyin ang eksaktong mga talata sa indent, maaari kang magdagdag ng isang klase sa mga parapo na nais mong naka-indent, ngunit kinakailangan mong i-edit ang bawat talata upang magdagdag ng isang klase dito. Iyan ay hindi mabisa at hindi sumusunod sa mga pinakamahusay na kasanayan sa coding ng HTML .

Sa halip, dapat mong isaalang-alang kapag nag-indent ng mga talata. Nag-indent kayo ng mga talata na direktang sumusunod sa ibang talata. Upang gawin ito, maaari mong gamitin ang katabi ng tagapili ng kapatid. Sa tagapili na ito, pinipili mo ang bawat talata na kaagad na sinundan ng isa pang talata.

p + p {text-indent: 2em; }

Dahil nakikilala mo ang unang linya, dapat mo ring tiyakin na ang iyong mga talata ay walang anumang espasyo sa pagitan nila (na default ng browser). Sa estilo, dapat kang magkaroon ng puwang sa pagitan ng mga talata o indent sa unang linya, ngunit hindi pareho.

p {margin-bottom: 0; padding-bottom: 0; } p + p {margin-top: 0; padding-top: 0; }

Negatibong Indent

Maaari mo ring gamitin ang ari - arian ng text-indent , kasama ang negatibong halaga, upang maging sanhi ng pagsisimula ng isang linya upang pumunta sa kaliwa kumpara sa kanan tulad ng isang normal na indent. Maaari mong gawin ito kung ang isang linya ay nagsisimula sa isang marka ng panipi upang ang quote character na lumilitaw sa bahagyang margin sa kaliwa ng talata at ang mga titik sa kanilang sarili pa rin form ng isang magandang kaliwa pagkakahanay.

Sabihin, halimbawa, na mayroon kang isang talata na isang inapo ng isang blockquote at nais mo itong maging negatibo sa pag-indent. Maaari mong isulat ang CSS na ito:

blockquote p {text-indent: -.5em; }

Ito ay magbibigay sa pagsisimula ng talata, na maaaring kabilang ang pagbubukas ng character ng quote, na bahagyang ililipat sa kaliwa upang lumikha ng hanging bantas.

Tungkol sa Mga Margins at Padding

Kadalasan sa disenyo ng web, gumamit ka ng mga halaga ng margin o padding upang ilipat ang mga elemento at lumikha ng puting espasyo. Gayunpaman, ang mga pag-aari na iyon ay hindi gagana upang makamit ang indented epekto ng talata. Kung inilalapat mo ang alinman sa mga halagang ito sa parapo, ang buong teksto ng talata na iyon, kabilang ang bawat linya, ay puwede sa halip na sa unang linya.