CSS interno

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

CSS interno è un metodo per aggiungere stili CSS a un documento HTML inserendoli all’interno di un tag <style> nella sezione <head> del documento. Questo approccio ti permette di applicare stili a più elementi di una singola pagina senza bisogno di fogli di stile esterni. Il CSS interno è utile per definire gli stili di un singolo documento o apportare rapidamente modifiche agli stili.

Ecco la sintassi di base per usare CSS interno:

<!DOCTYPE html>
<html>
<head>
    <title>Internal CSS</title>
    <style>
        body {
            background-color: lightblue;
        }
        p {
            color: blue;
            font-size: 16px;
        }
    </style>
</head>
<body>
    <h1>Welcome to My Page</h1>
    <p>This is a paragraph of text.</p>
</body>
</html>

In questo esempio, il tag <style> contiene regole CSS che impostano il colore di sfondo del body su azzurro e il colore del p (paragrafo) su blu, con una dimensione del carattere di 16 pixel. Questi stili si applicheranno a tutti gli elementi all'interno del documento HTML.

Sfida

Facile

Ti viene fornito un documento HTML. Usa CSS interno per applicare al documento le seguenti proprietà:

Imposta il colore di sfondo di body su lightgreen.
Imposta il colore del testo di tutte le intestazioni h1 su red.
Imposta la dimensione del carattere di tutti i paragrafi (p) su 18px.

Ti viene fornito del codice CSS iniziale.

Provalo tu

<!DOCTYPE html>
<html>
<head>
    <title>Internal CSS</title>
    <style>
        body {
            
        }
        h1 {
            
        }
        p {
            
        }
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
</body>
</html>