La proprietà position dei CSS permette di alterare il normale posizionamento degli elementi presenti nella pagine.
Position può assumere i valori:
Static è il valore predefinito della proprietà position. Siccome si tratta del valore predefinito, non è necessario assegnare il valore static, a meno che di non dover ripristinare il posizionamento predefinito, modificato precedentemente.
Prendiamo come esempio questi due blocchi:
Come risultato vediamo il primo blocco sopra il secondo:
Il valore relative altera il normale ordine di posizionamento
In questo caso abbiamo aggiunto allo stile del secondo div "position:relative; left:50px".
Il risultato è che il secondo blocco è spostato di 50 pixel a sinistra rispetto al posizionamento predefinito, mentre il terzo blocco rimane nella sua posizione originale.
Tramite position:absolute possiamo posizionare un blocco in una posizione assoluta rispetto alla nostra pagina HTML o al blocco di riferimento.
Ad esempio:
.posizionamento_assoluto { position:absolute; top:50px; right:10px; }
Posiziona gli elementi o i blocchi con id posizionamento_assoluto in alto, a 50 pixel dall'inzio della pagina, e a 10 pixel dal lato destro della pagina o del blocco di riferimento.
position:fixed permette di posizionare un blocco che rimane fisso nella pagina, cioè la sua posizione non cambia anche se facciamo scorrere la pagina.
Ad esempio:
.posizionamento_fisso { position:fixed; bottom:10px; }
Posiziona un blocco in posizione fissa a 10 pixel dal fondo della pagina.
(Annunci Google)
Ultime pagine
Non forniamo nessuna garanzia di assenza di errori nei contenuti del sito.
Non si assume nessuna responsabilità per eventuali errori presenti nel sito, e per i contenuti dei siti linkati.
- Privacy