Ang pag-underline ng isang dokumento o isang teksto ay palaging itinuturing na madali. Ngunit kung isasaalang-alang natin ang kaso para sa mga website, madali pa ba ito? Karamihan sa atin ay sasabihin oo ngunit ang paggawa ng isang pahalang na linya kasama ang ilang mga pasadyang disenyo ay ginagawang nakakapagod ang simpleng gawain. Simulan ang Paglalakbay ng Dekorasyon ng Teksto Gamit ang CSS sa sumusunod na pamamaraan:
- Ano ang Dekorasyon sa Teksto?
- Mga uri ng Mga Dekorasyon sa Teksto sa CSS
- Pagpapaganda ng Teksto Gamit ang CSS: Code
- Skip ng Dekorasyon ng Teksto
Ano ang Dekorasyon sa Teksto?
Itinatakda nito ang hitsura ng mga pandekorasyon na linya sa teksto. Ito ay isang maikling ari-arian para sa:
- linya ng dekorasyon-text
- text-dekorasyon-kulay
- istilo ng text-dekorasyon
Ito ay tinukoy bilang isa o higit pang mga halagang pinaghiwalay ng puwang na kumakatawan sa mahabang kamay na temga katangian ng xt-dekorasyon.
Syntax:
dekorasyon sa teksto: || ||
Kung saan,
linya ng dekorasyon-teksto: Ginagamit ito upang maitakda ang uri ng dekorasyong ginamit tulad ngsalungguhitan, overline, at line-through.
kulay-dekorasyon-kulay:Ginagamit ito upang maitakda ang kulay ng dekorasyon.
istilo ng text-dekorasyon: Ginagamit ito upang maitakda ang istilo ng linya tulad ngsolid, wavy, tuldok, dashing, doble
kung paano itakda ang java classpath sa linux command line
Mga uri ng Mga Dekorasyon sa Teksto sa CSS
- Overline:
#decoration {text-decoration: overline} 
- Line-Through:
#decoration {text-decoration: line-through}- Salungguhit:
#decoration {text-decoration: underline}- Kumbinasyon:
#decoration {text-decoration: underline line-through overline}Output:
Pagpapaganda ng Teksto Gamit ang CSS: Code
Code:
CSS Code:
#overline {text-decoration: wavy overline lime} #underover {text-decoration: dashing underline overline} #dotted {text-decoration: underline overline dotted red} #wavy {text-decoration: line-through wavy}Output:
Skip ng Dekorasyon ng Teksto
Ang isang pag-aari na kilala bilang text-dekorasyon-laktawan ay maaari ding gamitin kung saan ang isang text overline, line-through at underline. Nakakatulong ito sa pagdekorasyon ng teksto. Tinukoy lamang nito kung paano iginuhit ang overline at underline kapag naipasa nila ang mga ascenders at mga bumababa.
#decoration {text-decoration-skip: ink}Ang mga halagang maaaring magamit sa mga laktawan sa dekorasyon ng teksto ay:
mga bagay : (default) nilaktawan ng linya ang mga inline na bagay, tulad ng mga imahe o mga elemento ng inline-block.
wala : linya tumatawid lahat.
mga puwang : nilaktawan ng linya ng dekorasyon ang mga puwang, mga character na separator ng salita, at anumang mga puwang na itinakda na may spacing ng liham o mga puwang ng salita.
tinta : nilaktawan ng linya ng dekorasyon ang mga glyph, mga bumababa o umaakyat.
mga gilid : ang linya ng dekorasyon ay nagsisimula nang bahagya pagkatapos ng panimulang gilid ng nilalaman at nagtatapos nang bahagya bago magtapos ang gilid ng nilalaman.
dekorasyon ng kahon : Nilaktawan ang linya ng dekorasyon sa minana na margin, border, at padding.
Dahil ang pag-aari na ito ay hindi suportado ng anumang browser ngunit wala pang demo, ngunit narito ang isang halimbawa sa imahe sa ibaba kung paano maaaring magmukhang bawat isa sa mga halaga sa sandaling ipinatupad ang text-decor-skip.
Sa pamamagitan nito, natapos na kami sa dekorasyong Tekstong ito Gamit ang CSS blog. Kung mayroon kang anumang mga query tungkol sa paksang ito, mangyaring mag-iwan ng komento sa ibaba at babalikan ka namin.
Suriin ang aming na kasama ng live na pagsasanay na pinamunuan ng magtuturo at karanasan sa proyekto sa totoong buhay. Ang pagsasanay na ito ay gumagawa sa iyo ng kasanayan sa mga kasanayan upang gumana sa back-end at front-end na mga teknolohiya sa web. Kabilang dito ang pagsasanay sa Pag-unlad sa Web, jQuery, Angular, NodeJS, ExpressJS, at MongoDB.
kung paano wakasan ang isang programa sa java
May tanong ba sa amin? Mangyaring banggitin ito sa seksyon ng mga komento ng 'Dekorasyong Teksto gamit ang CSS' na blog at babalikan ka namin.