June 7
Cascading Style Sheets è un linguaggio di foglio di stile utilizzato per progettare siti web ed è spesso usato per creare menu stilizzati per la navigazione del sito. La combinazione di CSS con HTML, è possibile creare il proprio box menu utilizzando una lista non ordinata HTML. Le liste non ordinate sono liste contrassegnate con proiettili, creati in HTML usando il tag <ul>. CSS permette di stile liste non ordinate e trasformare elenchi puntati-point in un menu in scatola singola linea.
1 Aprire il blocco note e compilare i nomi degli elementi che si desidera visualizzare sul menu utilizzando una lista non ordinata HTML:
<Div id = "MenuBox">
<Ul>
<Li> <a href="item1.html"> Articolo 1 </a> </ li>
<Li> <a href="item2.html"> Articolo 2 </a> </ li>
<Li> <a href="item3.html"> Articolo 3 </a> </ li>
</ Ul>
</ Div>
2 Aggiungere il seguente CSS nella sezione <head> del codice HTML per rimuovere i proiettili:
<Style type = "text / css">
MenuBox ul
{
list-style: none;
}
</ Style>
3 Aggiungere il seguente CSS all'interno dei tag <style> a fare l'elenco caduta in una sola riga:
MenuBox Li
{
float: left;
}
4 Aggiungere la casella stile del menu nel CSS:
MenuBox li a
{
altezza: 2em;
line-height: 2em;
float: left;
Larghezza: 9em;
blocco di visualizzazione;
border: 1px #ccc solido;
color: # 000;
text-decoration: none;
text-align: center;
}
5 Salvarlo come un file HTML.