sei in home - tutorial - home page con xhtml strict - lezione 13
Scarica il file menudx.htm e leggi il codice corrispondente.
Ci soffermiamo, in particolare, nella parte di codice riferita al box #destra (quella interna ai tag <div id="#destra"> e </div>).
<div id="destra">
<div class="menu2st">studenti</div>
<ul>
<li class="stud"><a href="#" accesskey="d" title="disegni e attività grafiche spiegate dai bambini">(D)isegni</a></li>
<li class="stud"><a href="#" accesskey="l" title="lavori manuali e realizzazioni personali">(L)avori</a></li>
<li class="stud"><a href="#" accesskey="i" title="i bambini e le bambine propongono">(I)dee</a></li>
<li class="stud"><a href="#" accesskey="c" title="i bambini e le bambine chiedono, si informano e discutono">(C)onfronti</a></li>
</ul>
<div class="menu2classi">dalle classi</div>
<ul>
<li class="classi"><a href="#" accesskey="p" title="l'attività progettuale in classe e tra le classi">(P)rogetti</a></li>
<li class="classi"><a href="#" accesskey="u" title="la scuola fuori dalla scuola">(U)scite</a></li>
<li class="classi"><a href="#" accesskey="n" title="le ultime notizie dalle classi">(N)ews</a></li>
</ul>
</div>
Il titolo della sezione di menu, 'studenti', è interno al box identificato con la classe .menu2st.
Le voci del menu sono rappresentate come elementi (<li>...</li>) di un elenco non ordinato (<ul>...</ul>). Ad ogni voce di elenco è stata attribuita la classe .stud con il compito di specificarne le caratteristiche (vedi lezione successiva).Trattandosi di link, sono stati inseriti anche, all'interno del tag <a>, gli attributi:
Ulteriori riflessioni circa l'uso di questi attributi sono state già espresse nella lezione 7 di questo tutorial. Le considerazioni espresse a commento di questa sezione di menu sono estendibili alla successiva sezione del menu ('dalle classi').