CSS per menù di links incolonnati...

[goat]

Ho fatto un po' di ricerche, ma non sono riuscito a cavarne fuori nulla.
In pratica ho un normale menù laterale, incolonnato, con una lista di 5 links di normale testo.
Volevo iniziare proprio da questo lavoro ad utilizzare il seguente codice:

<div id="menu-laterale">
<ul>[*]Scaffale promozioni[*]Cerca vino[*]Le aziende comunicano/Top 10[*]Community di consumatori[*]Inserisci vino[/list]
</div>

Ma che CSS devo associargli in modo tale che ogni singolo link abbia semplicemente un cambio di colore come effetto hover?
Ovviamente non si dovrebbero visualizzare sottolineati.
E ancora: non riesco a capire che utilità abbia il tag <ul>. Questo codice l'ho copiato da alcuni esempi e non sono riuscito a manipolarlo come credevo, soprattutto per quanto riguarda il posizionamento.
Attendo link, consigli, righe di codice ed altro...

Grazie mille,
goat

[pierofix]

Originariamente inviato da goat
Ma che CSS devo associargli in modo tale che ogni singolo link abbia semplicemente un cambio di colore come effetto hover?
Ovviamente non si dovrebbero visualizzare sottolineati.

Innanzitutto non utilizzerei il trattino nel nome di un id/classe: mi pare non sia consentito. Meglio, magari, menu_laterale oppure menuLaterale (anche se il nome dovrebbe rispecchiare il significato, non la presentazione, quindi 'laterale' non è un granchè).

Poi, l'istruzione che soddisfa la tua richiesta è il seguente:

#menu_laterale ul a { text-decoration:none }
#menu_laterale ul a:hover { color:#f00 }

non riesco a capire che utilità abbia il tag <ul>

Solitamente si utilizza una lista non ordinata per strutturare i menu principalmente per due motivi:

1. semanticamente parlando, un menu si può considerare effettivamente come una lista di collegamenti;
   
2. in termini di accessibilità ai contenuti, uno screen-reader - ad esempio - è molto più facilitato nella lettura di una lista piuttosto che di una serie consecutiva di link, priva di caratteri stampati intermedi.

[andrea.paiola]

Originariamente inviato da pierofix
Innanzitutto non utilizzerei il trattino nel nome di un id/classe: mi pare non sia consentito.

è consentito, è consentito...
oggi Piero è proibizionista

[pierofix]

Originariamente inviato da andrea.paiola
è consentito, è consentito...
oggi Piero è proibizionista

Mi era sorto 'sto dubbietto... Ma non ti credo, così, sulla parola. Dammi un link, presto!

[goat]

Ok, aggiungendo anche questo CSS per il div:

#menu-laterale {
font-size: 9px;
color: #EEEEEE;
width: 165px;
text-decoration:none;
font-style: regular;
}

Non riesco comunque ad eliminare la sottolineatura ed il tipico colore viola per i links. Inoltre il mio menù è come se avesse un "padding-left" impostato, mentre a me serve che sia allineato a sinistra a 0px per motivi di grafica.

[andrea.paiola]

Originariamente inviato da pierofix
Dammi un link, presto!

http://www.w3.org/

[pierofix]

Originariamente inviato da andrea.paiola
http://www.w3.org/

Intendevo questo:

- http://www.w3.org/TR/1998/REC-xml-19...sec-common-syn

Names and Tokens. Hai ragione tu, il trattino è contemplato.

[andrea.paiola]

Originariamente inviato da pierofix
Intendevo questo:

- http://www.w3.org/TR/1998/REC-xml-19...sec-common-syn

Names and Tokens. Hai ragione tu, il trattino è contemplato.

bastava guardare il CSS di http://www.w3.org
ci sono classi e id col trattino :rollo:

[pierofix]

Goat, per riferirti ai link contenuti nell'elemento #menu-laterale devi usare questo selettore:

#menu-laterale a

[pierofix]

Originariamente inviato da andrea.paiola
bastava guardare il CSS di http://www.w3.org
ci sono classi e id col trattino :rollo:

Sagaaacee.