Proprietà float CSS

Recomendazione di corso:

Definizione e uso

Se si float un elemento non sostituibile, è necessario specificare una larghezza chiara; altrimenti, essi saranno il più piccolo possibile.

Nota:Se ci sono pochissimo spazio disponibile in una riga per un elemento fluttuante, quest'elemento salterà alla riga successiva, e questo processo continuerà fino a che una riga avrà abbastanza spazio.

Vedi anche:

Corso CSS:Posizionamento CSS

Manuale HTML DOM:Proprietà cssFloat

Esempio

Fare fluttuare l'immagine a destra:

img
  {
  float:right;
  

Prova a fare tu stesso

Sintassi CSS

float: none|left|right|initial|inherit;

Valore dell'attributo

Valore Descrizione
left L'elemento fluttua a sinistra.
right L'elemento fluttua a destra.
none Valore predefinito. L'elemento non fluttua e viene visualizzato nella posizione in cui compare nel testo.
inherit Definire che l'attributo float debba essere ereditato dal genitore dell'elemento.

Dettagli tecnici

Valore predefinito: none
Ereditarietà: no
Versione: CSS1
Sintassi JavaScript: object.style.cssFloat="left"

Esempio TIY

Applicazione semplice della proprietà float
Fare fluttuare l'immagine a destra di un paragrafo.
Fare fluttuare l'immagine con bordi e margini a destra del paragrafo
Fare fluttuare l'immagine a destra del paragrafo. Aggiungere bordi e margini all'immagine.
Immagine con titolo fluttuante a destra
Fare fluttuare l'immagine con il titolo a destra
Fare fluttuare la prima lettera del paragrafo a sinistra
Fare fluttuare la prima lettera del paragrafo a sinistra e aggiungere stili a questa lettera.
Creare un menu orizzontale
Creare un menu orizzontale utilizzando il float con link a una colonna.
Creare una pagina iniziale senza tabella
Creare una pagina iniziale con intestazione, piè di pagina, elenco laterale e contenuto principale utilizzando il float.

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta completamente l'attributo.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0