Štýl dekorácie textu - Triky CSS

Anonim

Táto text-decoration-stylevlastnosť nastavuje štýl podčiarknutia odkazov a podčiarknutia, nadčiarknutia alebo prešmykovania v ľubovoľnom text-decorationpoužitom texte .

a ( text-decoration-style: solid; )

Hodnoty

  • solid: predvolená hodnota. Dekorácia je jedna plná čiara.
  • double: Dekorácia je dvojica pevných čiar.
  • dotted: Dekorácia je prerušovaná čiara.
  • dashed: Dekorácia je prerušovaná čiara.
  • wavy: Dekorácia je vlnovka.

Ukážka

V čase písania tohto článku text-decoration-styleje podporovaná iba oficiálne vo Firefoxe. Bude fungovať aj v prehliadačoch Chrome s povoleným príznakom experimentálnych funkcií webovej platformy.

Prezrite si štýl textovej dekorácie Pen od CSS-Tricks (@ css-tricks) na CodePen.

Skratka

V prehľadávačoch, ktoré podporujú text-decoration-stylea text-decoration-colormôžete pridať štýl výzdoby ku text-decorationskratkovej vlastnosti:

.underlined ( text-decoration: underline dotted red; )

Túto predponu momentálne podporuje iba Firefox. Safari to podporuje -webkitpredponou. Prehliadač Chrome tiež vyžaduje -webkitpredponu a experimentálne funkcie webovej platformy povolené v príznakoch prehliadača Chrome.

Súvisiace

  • text-decoration
  • text-decoration-line
  • text-decoration-color
  • text-decoration-skip

Viac informácií

  • štýl textovej výzdoby v module dekorácie textu CSS W3C úrovne 3 CR
  • štýl dekorácie textu na MDN

Podpora prehľadávača

Chrome Safari Firefox Opera IE Android iOS
31 * Žiadne 6 † Žiadne Žiadne Žiadne Žiadne

* iba s povoleným príznakom experimentálnych funkcií webovej platformy

† Firefox 6+ s -mozpredponou, 36+ bez predpon.