Gli Elenchi non ordinati [Corso di HTML]Lezione 7

« Older   Newer »
 
.
  1. jackdo
     
    .

    User deleted



    Gli Elenchi non ordinati [Corso di HTML]
    Lezione 7


    Nella scorsa puntata abbiamo parlato degli elenchi non ordinati, in questa vedremo i loro complementari: gli elenchi disordinati ...oops non ordinati.

    A prescindere dal fatto che gli elenchi non ordinati si comportano quasi allo stesso modo di quelli ordinati, vediamo un po come implementarli per riuscire a sfruttarli ad hoc.

    Per definire un tipo di elenco non ordinato si utilizza il tag <ul> che è l'abbreviazione di Unordered List (è giusto quindi chiamarli elenchi disordinati e no non ordinati! ;-) ).

    La sintassi è la seguente:

    CODICE
    <UL type=tipoSimbolo>

    ...

    definizione voci elenco

    ...

    </UL>



    Qui tipoSimbolo indica appunto il tipo di simbolo che viene abbinato ad ogni voce dell'elenco. Le possibili scelte ricadono tra 'circle', 'square' e 'disc' che indicano appunto cerchi, quadrati e dischi.

    La differenza, come potrete intuire, tra cerchi e dischi è che i primi sono vuoti e quindi viene utilizzato lo sfondo della pagina come riempimento.

    Per definire le voci dell'elenco è necessario utilizzare un altro tag, ma a noi già familiare e cioè "LI".

    Ripetiamo brevemente che LI ha la funzione di ritorno a capo e di inserimento del simbolo prescelto tra circle, square e disc ed inoltre ricordiamo che non necessita del tag di chiusura.

    La sintassi è:

    CODICE
    <LI> ... Voce Elenco... </LI>



    Vediamo un po ora come è possibile personalizzare gli elenchi ordinati e non:

    Negli elenchi ordinati, sia l'attributo type che start possono essere utilizzati anche all'interno di una sola voce e cioè come attributi non di OL, ma di LI. Ciò può essere poco utile, se non sconsigliato, per l'attributo type, ma può risultare ad hoc per utilizzare sistemi di numerazione non incrementati in modo standard. Ad esempio potrebbe servire una numerazione da 0 a 10 e specificare solo valori pari, oppure una numerazione che ogni tanto si interrompa e riprenda quindi da un nuovo valore specificato.

    Nel caso degli elenchi non ordinati vale lo stesso, ma ovviamente l'attributo 'start' non è utilizzabile.


    Una funzionalità talvolta utile degli elenchi è che possono essere annidati. Ciò permette di creare strutture gerarchiche che bene si addicono a rappresentare ad esempio directory o alberi genealogici.

    L'utilizzo è molto semplice e intuitivo: il browser indenta un nuovo elenco (lo sposta a destra rispetto a quello precedente) quando trova un nuovo tag di apertura OL (<ul>) senza aver prima trovato primo quello di chiusura OL (/UL) del precedente. Attenzione però che è facile creare confusione nel codice; si consiglia pertanto di schematizzare prima bene su carta ciò che si vuole rappresentare e poi annotare tutti i relativi tag di apertura e chiusura ad ogni cambio di indentazione.


    Altra tipologia di elenchi è quella di definizione o di glossario.

    La loro implementazione avviene tramite l'utilizzo dei tag <dl>, <dt> e <dd> seguendo la seguente sintassi (la tabulazione che ho utilizzato è ininfluente per il browser, ma facilita la lettura e la revisione del codice):

    CODICE
    <DL>

    <DT> Termine1

    <DD> DefinizioneDi1

    <DT> Termine2

    <DD> DefinizioneDi2

    ...

    <DT> Termine N

    <DD> DefinizioneDiN

    </DL>


    Come si può notare DL (Definition List) viene utilizzato allo stesso modo di <ul> e <ol>, ci sono invece due ulteriori tag al posto di <li> e cioè <dt> e <dd>.


    <dt> viene utilizzato per la menzionare il termine da definire, mentre <dd> lo definisce.

    La loro effettiva implementazione varia tra i vari browser, ma la maggioranza scrivono il termine su una riga e la definizione, con un piccolo rientro, su quella successiva.

    Per migliorare la comprensione, sarebbe però opportuno (riflessione personale) di scrivere il termine in grassetto e la definizione in corsivo; guardate infatti i due esempi seguenti che sono due definizioni tratte dal vocabolario Garzanti:

    Metodo Standard:

    Simulare

    Manifestare sentimenti insinceri; mostrare le cose diverse da come sono.

    Emulare

    Cercare di eguagliare o di superare qualcuno in nobile gara.


    Metodo Alternativo:

    Simulare

    Manifestare sentimenti insinceri; mostrare le cose diverse da come sono.

    Emulare

    Cercare di eguagliare o di superare qualcuno in nobile gara.

    A voi la scelta di quale vi sembra il più efficace per esprimere l'intenzione di definire dei termini.

    Non dimentichiamo però che HTML è nato come linguaggio per esprimere concetti a persone e non, come attraverso i tradizionali e freddi linguaggi di programmazione, a computer.

    Concludiamo dicendo che esistono anche altri due tag (non fisici, ma logici) per definire elenchi, sono <menu> e <dir>.

    Questi, però, non vengono quasi mai utilizzati visto che hanno quasi sempre lo stesso comportamento delle liste non ordinate.

    Vi rimando, ora, alla prossima e interessantissima puntata sulle Tabelle.



    Software Planet
     
    .
0 replies since 29/4/2010, 13:22
 
.
Top