HTML and CSS Reference
In-Depth Information
<input type="checkbox" checked="true" /> Valore 1
<span class="error">Errore!</span>
</label>
<p>Paragrafo</p>
<div>Div</p>
<pre>Preformattato</p>
Esempio 4.17
- CSS
input[type="checked"] + .error {
font-weight:bold;
}
p ~ pre {
background: yellow;
}
Il primo selettore recupera un tag con class
error
posto direttamente dopo un tag
input
di tipo checkbox, mentre il secondo agisce su un tag
pre
posto dopo un tag
p
, ma non im-
mediatamente.
I selettori di CSS sono molto complessi e possiamo utilizzare una grammatica ad
hoc per gestire le regole. Maggiori informazioni sulle specifiche sono disponibili su
Le specifiche CSS consentono di indicare un posizionamento relativo o assoluto
dell'elemento rispetto al contenitore, oltre alla possibilità di far “galleggiare” gli elementi
all'interno dello spazio.
Alcuni elementi, come
img
,
span
o
a
, hanno la caratteristica di essere posti in linea ri-
spetto ai tag che li circondano, così che sia possibile mettere sulla stessa riga un'immagine
e un testo, per esempio. Molti altri tag seguono questo stesso approccio, ma ce ne sono al-
cuni, detti contenitori, che invece delimitano lo spazio: è il caso di
p
o
div
, per esempio.
In questo caso, si parla di elementi
block
, mentre, nel caso precedente, di elementi
inline
.
Queste informazioni saranno approfondite in maniera specifica nel prossimo capitolo, de-
dicato alla gestione del layout, ma erano comunque utili da introdurre in questo contesto.