Scrittura CSS e menu a tendina?

[xmetal]

Vorrei sapere se è più corretto scrivere il codice css nel primo o nel secondo modo:
1)
body {
background: #ffffff;
}
2)
body { background: #ffffff; }

So che sono usati tutti e due ma qual'è più corretto? Io ho sempre usato il primo ma avendo alla fine un testo troppo lungo vorrei sapere se usare il secondo metodo equivale al primo, così da ridurre di molto lo spazio.

Vorrei anche sapere come realizzare un menu a tendina con html e css (se si puo') o serve un altro linguaggio?

[airon]

I metodi sono del tutto equivalenti. Il metodo a mio avviso migliore e più corretto è però il primo con background: #fff indentato.

E' migliore per un fatto di leggibilità e manutenibilità futura. Voglio vederti ad andare a modificare un file di magari 3000-5000 righe scritto col metodo 2 :D

Molti siti web poi utilizzano compunque l'aggregazione css e la compressione e "mandano" all'utente la versione 2 del file scritto col metodo 1 (compattata in pratica) per risparmiare banda.

Continua pure ad usare il metodo 1.


Per il menù a tendina si fa tutto con html e css. T do una dritta. Usa le liste. <ul> e gli elementi <li>
Tieni presente che dentro un elemento di una lista <li> puoi mettere dentro un'altra lista <ul> e così via.

Prova a buttare giù qualche riga di codice e faccela vedere...


Ciaooo

[xmetal]

I metodi sono del tutto equivalenti. Il metodo a mio avviso migliore e più corretto è però il primo con background: #fff indentato.

E' migliore per un fatto di leggibilità e manutenibilità futura. Voglio vederti ad andare a modificare un file di magari 3000-5000 righe scritto col metodo 2 :D

Molti siti web poi utilizzano compunque l'aggregazione css e la compressione e "mandano" all'utente la versione 2 del file scritto col metodo 1 (compattata in pratica) per risparmiare banda.

Continua pure ad usare il metodo 1.


Per il menù a tendina si fa tutto con html e css. T do una dritta. Usa le liste. <ul> e gli elementi <li>
Tieni presente che dentro un elemento di una lista <li> puoi mettere dentro un'altra lista <ul> e così via.

Prova a buttare giù qualche riga di codice e faccela vedere...


Ciaooo
Grazie inanzitutto per la prima risposta, comunque sulla seconda ho qualche dubbio: io vorrei fare i menu a tendina (a cascata) dove quando passi il cursore su Home ad esempio, scende tutta la lista e il fatto della lista, dentro la lista, dovrebbe essere così?


<div>
<ul id="lista">
<li>
<ul id="lista2">
<li>Oggetto 1</li>
<li>Oggetto 2</li>
<li>Oggetto 3</li>
<li>Oggetto 4</li>
</ul>
</li>
<li>Oggetto 1</li>
<li>Oggetto 2</li>
<li>Oggetto 3</li>
</ul>
</div>

Non so se è proprio così...correggimi se sbaglio ;)

[airon]

Grazie inanzitutto per la prima risposta, comunque sulla seconda ho qualche dubbio: io vorrei fare i menu a tendina (a cascata) dove quando passi il cursore su Home ad esempio, scende tutta la lista e il fatto della lista, dentro la lista, dovrebbe essere così?


<div>
<ul id="lista">
<li>
<ul id="lista2">
<li>Oggetto 1</li>
<li>Oggetto 2</li>
<li>Oggetto 3</li>
<li>Oggetto 4</li>
</ul>
</li>
<li>Oggetto 1</li>
<li>Oggetto 2</li>
<li>Oggetto 3</li>
</ul>
</div>

Non so se è proprio così...correggimi se sbaglio ;)

Ciao è quasi corretto, devi aggiungere ai li gli a se vuoi linkare delle pagine.
Quindi:


<ul id="lista">
<li><a href="">link</a>
<ul id="lista2">
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
</ul>
</li>
</ul>


Ora devi pensare al CSS. Devi usare display:none e display: block per le ul interne e lo stato :hover sui li che devono far comparire le ul interne.

Provaci è semplice....

[wingman87]

Quando le regole sono poche io tendo a scriverle in una sola riga, altrimenti le scrivo su più righe. In questo modo secondo me la leggibilità è ottimale. Comunque in generale nulla ti obbliga ad adottare un solo stile.

[xmetal]

grazie ingman. airon non mi ricordo a cosa serve l'attributo "hover" xD comunque ci sono file scaricabili con tutti gli attibuti css fino al css3?

[simo8]

hover è il selettore per quando passi sopra all'elemento con il mouse.

[xmetal]

hover è il selettore per quando passi sopra all'elemento con il mouse.
Ah si giusto, grazie mille ;)