Visualizzazione dei risultati da 1 a 6 su 6

Discussione: Barra navigazione dinamica con i CSS

  1. #1
    Utente di HTML.it
    Registrato dal
    Nov 2016
    residenza
    Italy
    Messaggi
    53

    Barra navigazione dinamica con i CSS

    Ciao a tutti,

    come da titolo sto cercando di realizzare una barra di navigazione dinamica per il mio sito, dove la pagina in cui ci troviamo ha backgroung blu, mentre il resto della barra di navigazione è di colore arancio e per fare ciò utilizzo i CSS, il codice che utilizzo è il seguente:

    BARRA DI NAVIGAZIONE scritta in HTML:
    codice:
    <ul>
          <li><a href="..\index.php">Home</a></li>   
          <li><a href="..\Dispense.php">Dispense</a></li> 
          <li><a class="active" href="..\Esercizi.php">Esercizi</a></li> 
          <li><a href="..\Videolezioni.php">Videolezioni</a></li> 
          <li><a href="..\Tutorial.php">Tutorial</a></li>
        </ul>
    mentre il CSS è il segutente:
    codice:
    ul{
       list-style-type:none;
       margin:0;
       padding:0;
       overflow:hidden;
       background-color:#ff962d;
    }
    
    
    li{
       float:left;
    }
    
    
    li a{
       display:block;
       color:white;
       text-align:center;
       padding:14px 16px;
       text-decoration:none;
    }
    
    
    li a:hover:not(.active){
       background-color:#cbcbcb;
    }
    
    
    .active {
       background-color:#2814ff;
    }
    il mio problema consiste che devo scrivere il codice della barra di navigazione in ogni pagina, cambiando via via la classe active, per esempio nel caso della index, il codice della barra di navigazione sarebbe:
    codice:
    <ul>
          <li><a class="active" href="..\index.php">Home</a></li>   
          <li><a href="..\Dispense.php">Dispense</a></li> 
          <li><a href="..\Esercizi.php">Esercizi</a></li> 
          <li><a href="..\Videolezioni.php">Videolezioni</a></li> 
          <li><a href="..\Tutorial.php">Tutorial</a></li>
        </ul>
    mentre vorrei avere un unico codice, da poter poi includere nelle relative pagine web, così in caso di modifica della barra di navigazione mi basterebbe modificare solo il codice del file principale, ed a cascata mi troverei le modifiche su tutte le pagine del sito.

    Spero di essere stato chiaro.
    Grazie a tutti per l'aiuto!!

  2. #2
    È un classico inconveniente dei siti statici. L'ideale sarebbe in questi casi usare il php (anche senza database), altrimenti puoi provare con un iframe, per quanto sia una pratica sconsigliata.

  3. #3
    Utente di HTML.it
    Registrato dal
    Nov 2016
    residenza
    Italy
    Messaggi
    53
    Quote Originariamente inviata da VinzClortho Visualizza il messaggio
    È un classico inconveniente dei siti statici. L'ideale sarebbe in questi casi usare il php (anche senza database), altrimenti puoi provare con un iframe, per quanto sia una pratica sconsigliata.
    Ciao VinzClortho,

    sono passato alla realizzazione in html, dato che avendo inizialmente provato con php non mi funzionava la situazione, infatti avevo intenzione di realizzare una pagina: navbar.php, che poi richiamavo in tutte le pagine necessarie con include "..\percorso\navbar.php".
    Allora sposterò la discussione nella sezione dedicata al PHP.

    Grazie per la risposta :-)

  4. #4
    Utente di HTML.it
    Registrato dal
    Mar 2010
    Messaggi
    10
    Ciao scusami ma vediamo se puoi aiutarmi tu! Hai postato il codice del menu dove ci sono i link e i nomi del menu... io non riesco a modificare quella parte perché non so in che file si trovi il codice del menu.. Che file devo modificare per cambiare il codice del Menu?

  5. #5
    Utente di HTML.it
    Registrato dal
    Nov 2016
    residenza
    Italy
    Messaggi
    53
    Quote Originariamente inviata da nowahhh Visualizza il messaggio
    Ciao scusami ma vediamo se puoi aiutarmi tu! Hai postato il codice del menu dove ci sono i link e i nomi del menu... io non riesco a modificare quella parte perché non so in che file si trovi il codice del menu.. Che file devo modificare per cambiare il codice del Menu?
    Ciao, allora se ho capito bene ti interessa modificare questo codice:
    codice:
    ul{
       list-style-type:none;
       margin:0;
       padding:0;
       overflow:hidden;
       background-color:#ff962d;
    }
    
    
    li{
       float:left;
    }
    
    
    li a{
       display:block;
       color:white;
       text-align:center;
       padding:14px16px;
       text-decoration:none;
    }
    
    
    li a:hover:not(.active){
       background-color:#cbcbcb;
    }
    
    
    .active {
       background-color:#2814ff;
    }
    praticamente devi realizzare un file FoglioDiStile.css, quindi inserisci questo codice, e tutto il codice relativo allo stile del tuo sito.
    Fatto questo importi il foglio di stile in ogni pagina web del tuo sito.
    Spero di aver compreso correttamente la tua domanda.
    Se hai altri problemi postameli e cerchiamo di risolverli

  6. #6
    Utente di HTML.it
    Registrato dal
    Mar 2010
    Messaggi
    10
    No il problema era che non trovavo le pagine non i css xD cmq sia ho risolto.. la pagina topnav.php stava imboscata in mezzo a mille cartelle ! grazie cmq!

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2017 vBulletin Solutions, Inc. All rights reserved.