La Storia di Biancaneve by @MrkDrnk - Codewith.it

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

Referenze

valueValore alfanumerico o booleano contenuto in un elemento
checkedPre-imposta su 'true' il valore di un elemento input checkbox o radio
<link>Collega il documento corrente con una risorsa esterna
<th>Definisce una cella di intestazione di una tabella HTML.
autocompleteIndica l'opzione di auto completamento delle aree di input e/o di un form
maxImposta il valore numerico o temporale massimo per un elemento input

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Esercizi 05/03/2024 es1

Dashboard v1(2)

Heads Or Tails Random Tally

primo es =01/26/24

es da correggere

HTML Schwabisch

cosa sono le specialità

FORM PROF DA PROVARE

Selezione Telefoni

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.

<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>La Storia di Biancaneve</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>

    <header>
        <h1 class="title">La Magica Storia di Biancaneve</h1>
    </header>

    <section class="introduction">
        <h2>Introduzione</h2>
        <p>C’era una volta, in un regno lontano, una bellissima principessa chiamata <span  class="highlight">Biancaneve</span>. La sua bellezza era tale che la sua pelle era bianca come la neve, le labbra <span class="highlight">rosse</span> come il sangue e i capelli neri come l’ebano. Biancaneve viveva nel castello con la sua crudele matrigna, la <span class="highlight2">Regina Malvagia</span>, che era profondamente gelosa della sua bellezza.</p>
        <img src="https://www.ocarinaplayer.com/wp-content/uploads/2022/02/biancaneve-jpeg.webp"
         alt="Biancaneve e la Regina" class="image">
    </section>

    <section class="story">
        <h2>La Regina e lo Specchio Magico</h2>
        <p>La Regina Malvagia possedeva uno specchio magico al quale ogni giorno chiedeva: "Specchio, specchio delle mie brame, chi è la più bella del reame?". Per molti anni lo specchio rispondeva: "Tu sei la più bella". Tuttavia, un giorno, lo specchio rispose: "<span class="highlight">Biancaneve</span> è la più bella del reame!".  La Regina fu colta dalla gelosia e decise di sbarazzarsi di Biancaneve per sempre.</p>
        <img src="https://www.apcoaching.it/wp-content/uploads/2019/08/specchio-specchio-delle-mie-brame_ev.png" alt="La Regina e lo Specchio Magico" class="image">
    </section>

    <section class="story">
        <h2>La Fuga di Biancaneve</h2>
        <p>Furiosa, la Regina ordinò a un cacciatore di portare Biancaneve nella foresta e ucciderla. Come prova della sua morte, il cacciatore avrebbe dovuto riportare il cuore della principessa. Tuttavia, quando il cacciatore portò Biancaneve nella foresta, fu colpito dalla sua innocenza e bontà e non riuscì a eseguire l'ordine. Le disse di scappare e non tornare mai più al castello. Invece di ucciderla, il cacciatore prese il cuore di un cinghiale per ingannare la <span class="highlight2">Regina</span>. Biancaneve corse per ore attraverso la foresta, fino a quando si trovò di fronte a una piccola casetta. Esausta e affamata, decise di entrare. Dentro la casetta trovò sette lettini, piccoli tavoli e piatti. Biancaneve si addormentò in uno dei letti. La casetta apparteneva a sette nani che lavoravano nelle miniere. Quando tornarono a casa, trovarono Biancaneve addormentata. I nani erano inizialmente sorpresi, ma quando Biancaneve si svegliò e raccontò loro la sua storia, decisero di proteggerla. Le dissero di rimanere nella loro casa e di stare attenta alla Regina Malvagia. </p>
        <img src="https://statics.cedscdn.it/uploads/ckfile/202307/Ansa_16183548.jpg" alt="Biancaneve e i Nani" class="image">
    </section>

    <section class="story">
        <h2>La Mela Avvelenata</h2>
        <p>La <span class="highlight2">Regina Malvagia</span>, nel frattempo, scoprì che Biancaneve era ancora viva e decise di porre fine alla sua vita con l’inganno. Si travestì da vecchia mendicante e preparò una mela avvelenata. Si recò alla casetta dei nani e offrì la mela a Biancaneve, che ignara del pericolo, la morse. Non appena prese un morso, Biancaneve cadde in un sonno profondo, simile alla morte. Quando i nani tornarono a casa, trovarono Biancaneve stesa a terra senza vita. Erano distrutti dal dolore, ma non vollero seppellirla perché sembrava così bella anche nella morte. Allora decisero di costruire una bara di vetro e la misero in un bosco incantato, dove tutti potevano ammirarla.</p>
        <img src="	https://www.themousestories.com/wp-content/uploads/2020/07/Schermata-2020-07-09-alle-17.08.34.png" alt="Biancaneve e la Mela Avvelenata" class="image">
    </section>

    <section class="story">
        <h2>Il Risveglio di Biancaneve</h2>
        <p>Dopo qualche tempo, un principe che viaggiava per il regno vide Biancaneve nella bara di vetro. Colpito dalla sua bellezza, le diede un bacio. Fu un bacio d'amore vero, e quel bacio spezzò l'incantesimo. <span class="highlight">Biancaneve</span> si risvegliò e i due si innamorarono immediatamente. Il Principe chiese a Biancaneve di sposarlo e di vivere con lui nel suo regno. Biancaneve e il Principe si sposarono e vissero felici e contenti. La Regina Malvagia, invece, fu punita per la sua crudeltà e non osò mai più minacciare Biancaneve.</p>
        <img src="	https://www.corrierece.it/wp-content/uploads/2021/05/biancaneve.jpg" alt="Il Principe che risveglia Biancaneve" class="image">
    </section>

    <section class="accordion-section">
        <h2>Dettagli Extra</h2>

        <div class="accordion">
            <h3 class="accordion-header">Approfondimenti sulla Storia</h3>
            <div class="accordion-content">
                <p>La storia di Biancaneve è una delle fiabe più amate dei fratelli Grimm. Rappresenta temi come la gelosia, la bellezza interiore e l'importanza dell'amore vero. Questa fiaba è stata adattata in numerosi film e spettacoli teatrali, incluso il celebre film d'animazione di Walt Disney del 1937.</p>
            </div>
        </div>
    </section>

    <script src="script.js"></script>
</body>
</html>

body {
    font-family: 'Georgia', serif;
    background-color: #d497ff;
}

header {
    background-color: #8d80f0;
    text-align: center;
    padding: 30px;
}

.title {
    font-size: 3em;
    color: #ffffff;
    font-family: 'Times New Roman', Times, serif;
}

.introduction, .story, .accordion-section {
    padding: 20px;
    margin: 20px;
    background-color: #ffffff;

}

h2 {
    font-size: 2em;
    color: #4682b4;
    font-family: 'Verdana', sans-serif;
}

h3 {
    font-size: 1.5em;
    color: #2e8b57;
    margin-top: 20px;
}

p {
    font-size: 1.2em;
    line-height: 1.6;
    font-family: 'Arial', sans-serif;
}

.highlight {
    color: #e90069;
    font-weight: bold;
    font-style: italic;
}

.highlight2 {
    color: #6a5acd;
    font-weight: bold;
}

.image {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 10px 0;
}

.accordion-section {
    margin-top: 40px;
}

.accordion-header {
    background-color: #87cefa;
    padding: 10px;
    font-size: 1.5em;
    cursor: pointer;
    color: white;
}

.accordion-content {
    display: none;
    background-color: #f0f8ff;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
    border: 1px solid #4682b4;
}

.accordion-header.active {
    background-color: #4682b4;
}

.accordion-content.show {
    display: block;
}

/* Media Query per dispositivi mobili */
@media (max-width: 600px) {
    .title {
        font-size: 2em;
    }

    h2 {
        font-size: 1.5em;
    }

    h3 {
        font-size: 1.2em;
    }

    p {
        font-size: 1em;
    }

    .accordion-header {
        font-size: 1.2em;
    }

    .accordion-content {
        font-size: 0.9em;
    }
}

document.querySelector('.accordion-header').addEventListener('click', function() {
    this.classList.toggle('active');
    let content = this.nextElementSibling;
    content.classList.toggle('show');
});