Livia e la Foresta Incantata by @asia01 - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

<strong>Definisce una parte del testo importante con formattazione in grassetto.
<hr>Inserisce una linea orizzontale
maxImposta il valore numerico o temporale massimo per un elemento input
<iframe>Crea un frame all'interno di una pagina HTML.
<datalist>Crea una lista di opzioni pre-definite ed editabili per elementi di input
<canvas>Tag per disegnare grafica dinamica su pagine web.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Esercizio tabella

Selezione Telefoni

conta vocali con array

Esercitazione 1

La mia prima pagina html

poccodio inserimenti immagineee

Idee background personaggio

ESERCITAZIONE ORSI

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Livia e la Foresta Incantata</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        <h1>Livia e la Foresta Incantata</h1>
    </header>

    <section class="content">
        <p>C'era una volta, in un piccolo villaggio ai piedi di una grande montagna, una bambina di nome Livia. Livia aveva un dono speciale: riusciva a parlare con gli animali del bosco. Ogni giorno, si recava nella foresta incantata per fare amicizia con scoiattoli, uccelli e persino volpi. Tuttavia, nessuno nel villaggio le credeva. I grandi la guardavano con sospetto e i bambini ridevano di lei.</p>
        
        <p>Un giorno, una tempesta terribile si abbatté sul villaggio. Il vento soffiava forte e le nuvole oscuravano il cielo. Gli abitanti si rifugiarono nelle loro case, spaventati, ma Livia non aveva paura. Sentiva che qualcosa di strano stava per accadere nella foresta.</p>

        <p>Decise di andare a controllare e, appena arrivata, trovò il grande albero del Re Gufo, il più vecchio e saggio di tutti gli animali, in pericolo. Un fulmine aveva colpito le sue radici e l’albero rischiava di cadere. Livia corse dagli animali, chiamando a raccolta tutti i suoi amici del bosco.</p>

        <p>"Scoiattoli, volpi, cervi! Dobbiamo aiutare il Re Gufo!" gridò. Gli animali, fidandosi di lei, si misero subito all'opera. Gli scoiattoli portarono ramoscelli, le volpi scavarono la terra e i cervi, con la loro forza, sostennero il grande albero. Insieme riuscirono a salvarlo.</p>

        <p>Quando la tempesta finì e il sole tornò a splendere, il Re Gufo ringraziò Livia e gli animali per il loro coraggio. "Da oggi sarai conosciuta come la Custode della Foresta", disse, "e il tuo cuore sarà sempre legato a questo luogo magico".</p>

        <p>Tornata al villaggio, Livia raccontò l'accaduto, ma questa volta, gli abitanti del villaggio non risero. Videro gli animali seguirla fino alla piazza e capirono che la bambina non era solo una sognatrice, ma una vera eroina. Da quel giorno, Livia e i suoi amici del bosco vissero in armonia con il villaggio, proteggendo la foresta e tutti i suoi segreti.</p>

        <p class="end">E vissero tutti felici e contenti.</p>
    </section>

    <footer>
        <p>&copy; 2024 Storia di Livia</p>
    </footer>
</body>
</html>

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Georgia', serif;
}

body {
    background-color: #f0f8ff;
    color: #333;
    line-height: 1.6;
}

header {
    background-color: #264f4b;
    color: #fff;
    text-align: center;
    padding: 20px 0;
}

header h1 {
    font-size: 3rem;
    letter-spacing: 2px;
}

.content {
    max-width: 800px;
    margin: 40px auto;
    padding: 50 20px;
    background-color: #ffffff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
}

.content p {
    margin-bottom: 20px;
    font-size: 1.1rem;
    text-align: justify;
    color: #333;
}

.content .end {
    text-align: center;
    font-weight: bold;
    font-size: 1.2rem;
    margin-top: 30px;
    color: #264f4b;
}

footer {
    text-align: center;
    padding: 20px;
    background-color: #264f4b;
    color: #fff;
    position: relative;
    bottom: 0;
    width: 100%;
}

footer p {
    font-size: 0.9rem;
}