August 17
Una barra di navigazione non è definito in alcun modo uno; su molti siti web, come Google e Facebook, caratterizzato da una barra di navigazione nella parte superiore della pagina. Tuttavia, è possibile anche caratterizzato da una barra di navigazione lungo il bordo o lato della pagina - quello che funziona meglio per il tuo sito. Avrete bisogno di usare i CSS e DIV livelli per creare una barra di navigazione che si muove lungo con la tua pagina come scorre. Avendo la mossa barra di navigazione insieme alla pagina, i visitatori saranno sempre in grado di visitare rapidamente una pagina diversa.
1 Avviare un foglio di stile nella sezione <head> del documento HTML; un foglio di stile inizia con <style type = "text / css">.
2 Designare un ID per il div che sarà la vostra barra di navigazione. Se si desidera chiamare il vostro strato div "navigazione", si dovrebbe iniziare l'elemento come:
navigazione
{3 Posizionare il livello in cui si desidera la barra di navigazione a restare. Se si desidera un 25 pixel di altezza barra di navigazione per coprire l'intera larghezza della pagina e sedersi a filo con il bordo superiore del browser, il vostro elemento dovrebbe includere:
Navigazione {
Altezza: 25px;
width: 100%;
position: fixed;
top: 0px;
sinistra: 0px;
L'attributo "fisso" dice lo strato di muoversi lungo con la tua pagina, come i rotoli visitatori. Questo elemento è supportato nei principali browser: Internet Explorer, Mozilla Firefox, Safari e Google Chrome. Sarà necessario rimuovere i margini nel corpo della pagina di sedersi nella barra di navigazione a filo con i bordi del browser con:
body {
margin: 0px;}
Tutto ciò aggiunto alla elemento del corpo qui interesserà il corpo della tua pagina web; è possibile utilizzarlo per modificare il colore di sfondo e l'immagine o il carattere della pagina.
4 Impostare lo z-index per il vostro elemento, se la barra di navigazione sarà sovrappone il contenuto della pagina come visitatori scorrere. La z-index definisce quali livelli sono in cima; l'elemento più alto è in alto, e la più bassa è sul fondo. Il numero non importa, basta che uno è superiore all'altro. Se avrete solo due strati - la barra di navigazione e il corpo del tuo post - è possibile impostare in modo sicuro la vostra barra di navigazione a due. Chiudere la navigazione elemento bar con la staffa fine, ad esempio,
Navigazione {
Altezza: 25px;
width: 100%;
position: fixed;
top: 0px;
sinistra: 0px;
z-index: 2;}
5 Chiudere il foglio di stile con </ style>, sopra il tag di chiusura per la testa del documento (</ head>). Qualsiasi altro contenuto sulla tua pagina cadrà sotto la barra di navigazione quando si scorre in basso nella pagina.
6 Creare lo strato sulla tua pagina e compilare il contenuto di navigazione, ad esempio,
<Div id = "navigazione"> Navigazione Contenuto </ div>
L ' "id" deve essere lo stesso nome del nome dell'elemento nel foglio di stile. Salvare la pagina e testare la barra di navigazione nel browser.