Decorazione del testo

Fa parte della sezione Stilizzare con CSS del percorso HTML di Coddy. Lezione 22 di 76.

In CSS, la proprietà text-decoration viene utilizzata per aggiungere o rimuovere decorazioni al testo all'interno di un elemento HTML. Questa proprietà ti permette di sottolineare, sovralineare o barrare il testo, fornendo un'enfasi visiva o indicando stati specifici.

I valori comuni di text-decoration includono:

none: Rimuove qualsiasi decorazione del testo. Questo è il valore predefinito.

underline: Aggiunge una sottolineatura al testo.

overline: Aggiunge una linea sopra il testo.

line-through: Aggiunge una linea al centro del testo (barrato).

Per esempio:

a {
    text-decoration: none;
}

.underline {
    text-decoration: underline;
}

.strike {
    text-decoration: line-through;
}

Sfida

Facile

Ti viene fornito un documento HTML con un paragrafo (<p>) che contiene un elemento ancora (<a>) e una divisione (<div>). Il tuo compito è usare la proprietà text-decoration per applicare uno stile a questi elementi. Segui i passaggi riportati di seguito:

Scrivi una regola CSS che selezioni tutti gli elementi <a>. Imposta text-decoration su none per rimuovere la sottolineatura predefinita.
Aggiungi un attributo class con il valore "underline" all'elemento <p>.
Scrivi una regola CSS che selezioni tutti gli elementi con la classe underline. Imposta text-decoration su underline.
Aggiungi un attributo class con il valore "strike" all'elemento <div>.
Scrivi una regola CSS che selezioni tutti gli elementi con la classe strike. Imposta text-decoration su line-through.

Provalo tu

<html>
<head>
    <title>Text Decoration</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <p>This is a paragraph with a <a href="#">link</a>.</p>
    <div>This is a division.</div>
</body>
</html>