[HELP] Piccolo chiarimento sui fogli di stile

[D4rkAng3l]

Sono un novizio dei CSS...ho appena iniziato la guida di html.it

Ditemi se ho capito bene, facendo riferimento a questo esempio fatto sulla guida

/* Definisco le regole per il corpo del documento */
body { 
	 background: White; /* Prima dichiarazione: notate il punto e virgola finale!*/
	 font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; /* Seconda dichiarazione*/
	 font-size: 12px; /* Terza dichiarazione */
}

/* Titolo di primo livello */
h1 {
	color: black;
}

/* Paragrafo generico */
p {
	color: black;
	font: 12px/1.5 Georgia, "Times New Roman", serif;
}


#div1 {
	 background: Silver; /* Sfondo colr argento */
	 width: 300px; 
	  }

#div2 {
	 background: Silver;
	 width: 300px; 
	 position: absolute; 
	 top: 400px;	 
	 left: 400px;
}

Per prima cosa dice le caratteristiche che devono rispettare tutti gli elementi contenuti nel body ovvero: sfondo bianco, i tipi di caratteri potranno essere: Verdana, Geneva, Arial, Helvetica, sans-serif (ma in base a cosa? cioè il carattere standard è il Verdena, se poi uno non ha il Verdena allora userà l'Arial, se non c'ha manco l'Arial userà l'Helevetica e così via?) e poi imposta a 12 px la dimensione del testo nel body.

Successivamente stabilisce la regola che definisce le caratteristiche di TUTTI i titoli di prigmo livello dicendo solo che il colore dei titoli di primo livello è nero, le altre caratteristiche le eredità dalla regola del body, giusto?

Poi specifica con un'altra regola le caratteristiche di tutti i paragrafi generici e vengono cambiate alcune cose rispetto al body come la dimensione del testo e la famiglia di caratteri da usare, giusto?

La cosa che mi sfugge è questa parte:

#div1 {
	 background: Silver; /* Sfondo colr argento */
	 width: 300px; 
	  }

#div2 {
	 background: Silver;
	 width: 300px; 
	 position: absolute; 
	 top: 400px;	 
	 left: 400px;
}

ma in pratica che fà? stabilisce le regole per un determinato div1 e per un altro specifico div2 che avranno caratteristiche diverse? è per quello che ci mette il #? o si tratta di "famiglie" di div? ovvero quando poi nel body avrò i miei vari div essi potranno essere di tipo div1 oppure di tipo div2 e avere caratteristiche in base alla loro appartenenza...come funziona questa cosa?

Spero di averci capito qualcosa :-/

Grazie
Andrea

[fcaldera]

#div1 e #div2 nel css implicano che nell'HTML ci siano due strutture marcate come

<div id="div1">...</div>
...
<div id="div2">...</div>



quello che tu definisci come "famiglia" di div è invece il concetto di classe:

.classe1 {
...
}


implica che nell'html ci siano nessuno, uno o più di un elemento con classe classe1 ad es.

<div class="classe1">...</div>
...
<div class="classe1">...</div>
...
<span class="classe1">...</span>


Guarda tra i link utili, ci sono diverse guide che spiegano l'uso dei selettori