CSS
HTML
JavaScript
PHP
Introduzione
Coming Soon
Generatori
Varie

CSS text-decoration-color

La proprietà CSS3 text-decoration-color definisce il colore della decorazione del testo

La proprietà text-decoration-color permette di controllare il colore delle decorazioni applicate al testo, come la sottolineatura, la linea sopra o la barratura. È spesso usata in combinazione con text-decoration-line per ottenere uno stile più personalizzato e leggibile.

Sintassi

text-decoration-color: color;

Significato dei valori principali:

  • color: definisce il colore della decorazione del testo. Può essere espresso con valori:

    1. Esadecimali (#ff6347).

    2. RGB (rgb(255, 99, 71)).

    3. HSL (hsl(9, 100%, 64%)).

    4. parole chiave (red, blue, ecc.).


Esempio proprietà: text-decoration-color


Codice Esempio: text-decoration-color

CODE: CSSpreleva codice
  1. .text-decoration-color-example {
  2.   font-size: 22px;
  3.   text-decoration-line: underline;
  4.   text-decoration-color: #e06c75; /* Colore rosso tenue */
  5.   text-decoration-thickness: 2px;
  6.   text-underline-offset: 4px;
  7. }

Contenuto Esempio: text-decoration-color

Esempio di utilizzo di text-decoration-color

In questo esempio, la proprietà text-decoration-color viene utilizzata per cambiare il colore della sottolineatura:


Testo sottolineato con colore personalizzato

CSS e HTML per text-decoration-color:

  
  <style>
    .text-decoration-color-example {
      font-size: 22px;
      text-decoration-line: underline;
      text-decoration-color: #e06c75; /* Colore rosso tenue */
      text-decoration-thickness: 2px; /* Spessore della linea */
      text-underline-offset: 4px; /* Distanza della sottolineatura dal testo */
    }
  </style>
  
  <div class="text-decoration-color-example">
    Testo sottolineato con colore personalizzato
  </div>
  

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.

Supporto Browser

Browser Support

I Cookie su questo sito:

Il nostro sito utilizza cookie e altre tecnologie in modo tale che sia noi, sia i nostri partner, possiamo ricordarci di te e capire come tu e gli altri visitatori utilizzate il nostro sito. Qui puoi trovare ulteriori informazioni sui cookie e le altre tecnologie. Chiudendo questo banner o continuando la navigazione acconsenti all'uso dei cookie. Acconsento Info Cookies