Els llocs web atractius per als usuaris sovint requereixen que s'afegeixin de tant en tant diverses metodologies d'estil. En aquestes situacions, l'estil de la decoració del text es pot dur a terme de múltiples maneres en funció de diferents valors segons els requisits per fer que el lloc destaqui.
Aquest bloc tractarà les següents àrees de contingut:
Com configurar l'estil de decoració del text a Tailwind CSS?
L'estil de text es pot configurar i decorar amb l'ajuda del ' text-estil de decoració ” propietat assignada amb diferents valors d'estil.
Propietats de l'estil de decoració del text
Classe | Propietats |
decoració-sòlid | estil-decoració de text: sòlid; |
decoració-doble | text-decoració-estil: doble; |
decoració-ondulada | estil-decoració de text: ondulat; |
decoració amb guionets | text-decoration-style: guionat; |
decoració amb punts | text-decoració-estil: puntejat; |
Exemple: Configuració de l'estil de decoració del text a Tailwind CSS
Aquest exemple utilitza el que s'ha comentat anteriorment ' text-estil de decoració ” propietat amb tots els valors per estilitzar el text del paràgraf:
DOCTYPE html >< html >
< cap >
< meta conjunt de caràcters = 'utf-8' >
< meta nom = 'mirador' contingut = 'amplada=amplada del dispositiu, escala inicial=1' >
< guió src = 'https://cdn.tailwindcss.com' > guió >
cap >
< cos >
< div >
< pàg classe = 'subratlla la decoració sòlida...' > Aquest és el lloc web de Linuxhint pàg >
< pàg classe = 'subratlla decoració-doble...' > Aquest és el lloc web de Linuxhint pàg >
< pàg classe = 'subratlla la decoració-ondulada...' > Aquest és el lloc web de Linuxhint pàg >
< pàg classe = 'subratlla la decoració amb guionets...' > Aquest és el lloc web de Linuxhint pàg >
< pàg classe = 'subratlla la decoració amb punts...' > Aquest és el lloc web de Linuxhint pàg >
div >
cos >
html >
A partir d'aquest codi, apliqueu els passos següents:
-
- Incloeu el donat ' CDN ' camí dins del '
” per aplicar les funcionalitats de Tailwind. - Ara, creeu quatre paràgrafs utilitzant el ' 'etiqueta que conté el ' text-decoració ” propietat assignada amb un valor diferent en cada cas, tal com s'ha comentat.
- Això subratlla el text amb línies sòlides, dobles, ondulades, discontínues i de punts.
- Incloeu el donat ' CDN ' camí dins del '
Sortida
A partir d'aquest resultat, es comprova que el text ha estat decorat en conseqüència.
Conclusió
L'estil de text es pot configurar i decorar amb l'ajuda del ' text-estil de decoració ” propietat assignada amb diferents valors d'estil. Aquests valors inclouen sòlid, doble, ondulat, guionat i puntejat. Aquest bloc tractava de configurar l'estil de decoració del text amb Tailwind CSS.