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
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 |