Tekst-dekor-stil - CSS-triks

Anonim

Den text-decoration-styleeiendom komplekser stilen til understreking på lenker og understrekingen, overlinje, eller linje gjennom på hvilken som helst tekst med text-decorationbrukt.

a ( text-decoration-style: solid; )

Verdier

  • solid: Standaren. Dekorasjon er en hel linje.
  • double: Dekorasjon er et par faste linjer.
  • dotted: Dekorasjon er en stiplet linje.
  • dashed: Dekorasjon er en stiplet linje.
  • wavy: Dekorasjon er en bølget linje.

Demo

I skrivende stund text-decoration-stylestøttes det bare offisielt i Firefox. Det vil også fungere i Chrome-nettlesere med den eksperimentelle nettplattformfunksjonen flagg aktivert.

Se pennens tekst-dekorasjonsstil av CSS-Tricks (@ css-tricks) på CodePen.

Forkortelse

I nettlesere som støtter, text-decoration-styleog text-decoration-colordu kan legge til en dekorasjonsstil til en text-decorationstenografisk eiendom:

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

Foreløpig støtter bare Firefox dette uprefiksede. Safari støtter det med -webkitprefikset. Chrome trenger også -webkitprefikset og eksperimentelle nettplattformfunksjoner aktivert i Chrome-flagg.

I slekt

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

Mer informasjon

  • tekstdekorasjonsstil i W3C CSS Tekstdekorasjonsmodul Nivå 3 CR
  • tekst-dekorasjon-stil på MDN

Nettleserstøtte

Chrome Safari Firefox Opera DVS Android iOS
31 * Ingen 6 † Ingen Ingen Ingen Ingen

* bare med eksperimentelle nettplattformfunksjoner flagg aktivert

† Firefox 6+ med -mozprefiks, 36+ uprefiksert.