Visualizzazione Errata del menu a tendina

di il
3 risposte

Visualizzazione Errata del menu a tendina

<!DOCTYPE html>
<html lang="it-IT">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Correzione: width=device-width -->
    <link rel="stylesheet" href="styles.css">
    <title>Toeletta</title>
</head>

<body>
    <header>
        <h1>Toeletta</h1>
        <p>L'arte della cura e della bellezza per i tuoi amici a quattro zampe.</p>
    </header>
    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li class="dropdown">
                <a href="#">Servizi Toelettatura</a>
                <ul class="dropdown-menu">
                    <li><a href="#">Classic</a></li>
                    <li><a href="#">Ozono</a></li>
                </ul>
            </li>
            <li><a href="#">Contatti</a></li>
        </ul>
    </nav>
      
    <main>
        <section>
            <h2>Benvenuti alla Toeletta</h2>
            <p>Siamo una toeletta professionale dedicata alla cura e alla bellezza dei tuoi animali domestici. Presso la nostra toeletta, offriamo una varietà di servizi di toelettatura e cura che renderanno i tuoi amici a quattro zampe felici e sani.</p>
        </section>
        <section>
            <h2>I Nostri Servizi</h2>
            <ul>
                <li>Toelettatura completa</li>
                <li>Lavaggio e asciugatura</li>
                <li>Taglio delle unghie</li>
                <li>Igienizzazione</li>
            </ul>
        </section>
    </main>
    <footer>
        <p>Contattaci per appuntamenti e informazioni: <a href="tel:123 4567891">123 4567891</a></p>
        <p>Indirizzo: Via Sette Nani, 2/3, Windaria</p>
    </footer>
</body>

</html>

3 Risposte

  • Re: Visualizzazione Errata del menu a tendina

    Il file CSS collegato è questo:

    /* Reset dello stile di default del browser */
    body, h1, h2, h3, p, ul, li, a {
        margin: 0;
        padding: 0;
    }
    
    /* Stile globale */
    body {
        font-family: Arial, sans-serif;
        line-height: 1.6;
    }
    
    /* Intestazione */
    header {
        background-color: #333;
        color: white;
        text-align: center;
        padding: 2rem;
    }
    
    /* Navigazione */
    nav ul {
        list-style: none;
        background-color: #444;
        text-align: center;
        padding: 1rem 0;
    }
    
    nav ul li {
        display: inline;
        margin: 0 20px;
    }
    
    nav ul li a {
        text-decoration: none;
        color: white;
    }
    
    /* Stili specifici per il menù a tendina */
    .dropdown {
        position: relative;
    }
    
    .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #ffffff;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        z-index: 1;
        /* Altri stili di formattazione come larghezza, bordi, ecc. */
    }
    
    .dropdown:hover .dropdown-menu {
        display: block;
    }
    
    /* Nascondi il menù a tendina inizialmente */
    nav ul ul {
        display: none;
    }
    
    /* Mostra il menù a tendina quando il mouse passa sopra la voce padre */
    nav ul li:hover > ul {
        display: block;
    }
    
    /* Sezioni */
    section {
        padding: 2rem;
        border-bottom: 1px solid #ccc;
    }
    
    /* Piè di pagina */
    footer {
        text-align: center;
        padding: 1rem;
        background-color: #333;
        color: white;
    }
    
    footer a {
        color: white;
        text-decoration: none;
    }
    
  • Re: Visualizzazione Errata del menu a tendina

    Grazie del tuo quesito, però mi pare un po' scarso come spiegazione: oltre al titolo dove parli di “visualizzazione errata” (errata in che senso? cosa succede di preciso?) non hai aggiunto nessun'altra indicazione in merito al problema, salvo il codice intero della pagina che - per riprodurre il difetto - dovremmo prendere, copiare, visualizzare e analizzare al posto tuo.

    Il messaggio che passa è qualcosa del tipo “ho un problema, questo è il codice, vai di risoluzione”.

    Prova a specificare qualcosa di più in merito al problema, senza che chi vuole aiutare sia costretto a fare tutti i test e le verifiche in modo forzato (magari lo farebbe, ma non è giusto costringere).

  • Re: Visualizzazione Errata del menu a tendina

    26/08/2023 - Alka ha scritto:


    Grazie del tuo quesito, però mi pare un po' scarso come spiegazione: oltre al titolo dove parli di “visualizzazione errata” (errata in che senso? cosa succede di preciso?) non hai aggiunto nessun'altra indicazione in merito al problema, salvo il codice intero della pagina che - per riprodurre il difetto - dovremmo prendere, copiare, visualizzare e analizzare al posto tuo.

    Il messaggio che passa è qualcosa del tipo “ho un problema, questo è il codice, vai di risoluzione”.

    Prova a specificare qualcosa di più in merito al problema, senza che chi vuole aiutare sia costretto a fare tutti i test e le verifiche in modo forzato (magari lo farebbe, ma non è giusto costringere).

    Scusatemi, pensavo che per chi ha molta più esperienza di me che ho cominciato da una settimana fosse tutto molto più chiaro sia capire che individuare l'errore dando una letta ai due file… l'errore che mi si presenta è che al passaggio del mouse sulla dicitura Servizi Toeletta, invece del menu a tendina con le due voci che devo fare cliccabili, mi si apre una finestra della giusta dimensione, ma bianca senza scritte… non riesco a risolvere questo problema… o meglio se modifico in qualche modo cambio l'errore, ma non va a posto… non capisco dove sbaglio…. per questo ho messo tutti e due i file completi avrei potuto saltare qualcosa che invece va visto per individuare il problema.

Devi accedere o registrarti per scrivere nel forum
3 risposte