HTML tarjoaa erilaisia tyylivaihtoehtoja tekstille. HTML-tekstin alleviivaaminen on yksi niistä. Yksinkertaisesti alleviivaaminen piirtää suoran viivan tekstin alle viemättä alla olevaa viivaa. Tässä opetusohjelmassa opitaan, kuinka HTML-teksti alleviivataan < u > -tunnisteen, CSS-koodin, CSS-luokan ja aseta alleviivatut ominaisuudet ja vaihtoehdot.

Alleviivattu teksti < u > Tunniste

HTML tarjoaa < u > -tunnisteen voidakseen alleviivata annetun tekstin HTML-muodossa. < u > on alleviivatun aloitustagi ja < / u > käytetään alleviivatun pään asettamiseen. Alleviivaustunnisteita voidaan käyttää ongelmitta erilaisille tekstityypeille, kuten hyperlinkeille, lihavoidulle tekstille jne. Seuraavassa esimerkissä alleviivataan yksi sana tai täydellinen lause tai hyperlinkki. < u > tai alleviivattu HTML-tagi tukee kaikkia tärkeimpiä selaimia, kuten Google Chrome, Mozilla Firefox, Microsoft Edge, Safari tai Opera .

Alleviivaa teksti CSS-tekstikoristeluattribuutilla

CSS tarjoaa text-decoration -attribuutin alleviivatakseen erilaisia HTML-elementtejä. Voimme käyttää text-decoration-attribuuttia HTML-tekstin alleviivaamiseen. Tekstikoristelu-tyylimääritettä voidaan käyttää eri HTML-tunnisteiden tai -elementtien kanssa. Seuraavassa esimerkissä olemme käyttäneet < span > -tunnistetta tekstin valitsemiseksi ja alleviivatuksi.

Aseta tekstin alleviivauksen väri ja tyyli

Joissakin tapauksissa vain HTML-tekstin alleviivaaminen ei välttämättä riitä. Voimme myös värittää tai muuttaa alleviivatuksen tyyliä. CSS-attribuuttia text-decoration voidaan käyttää alleviivojen muotoiluun ja värittämiseen < u > tai ilman sitä. Alla annamme HTML-tekstin alleviivatun värin punaiseksi, vihreäksi ja tyylin aaltoilevaksi, katkoviivaiseksi, pisteviivaksi ja kaksinkertaiseksi.

wavy -tyyli luo ei suoran viivan, jossa viiva on aaltoileva kuin aallot.

dashed -tyyli luo katkoviivaisen alleviivauksen.

dotted -tyyli on samanlainen kuin katkoviiva, mutta pisteet ovat pienempiä.

double -tyyli asettaa kaksi alleviivaa, joissa oletusarvo on yksi alleviiva.

Punainen väri ja katkoviiva voidaan käyttää oikeinkirjoituksen, syntaksin tai yleisten virheiden ilmaisemiseen. Myös dotted

Käytä CSS-luokkaa HTML-tekstin alleviivaamiseen

Jokaisen alleviivatun CSS-koodin kirjoittaminen uudestaan ja uudestaan ei ole hyvää työtä. CSS-luokka voidaan luoda erilaisille alleviivaustapauksille ja tätä luokkaa voidaan käyttää HTML-tekstin alleviivaamiseen muiden HTML-tunnisteiden kanssa. Seuraavassa esimerkissä luomme erilaisia CSS-luokkia, kuten alleviivattu-punainen, alleviivattu-vihreä, jotta teksti voidaan luoda helposti alleviivatuksi.