Kurs XHTML: 1.1, 1.0 / HTML: 4.01, 4.0, 3.2, 3.0, 2.0 / CSS: 2.1, 2.0, 1.0 z przykładami

[Start] • [Elementy XHTML/HTML] • [Atrybuty XHTML/HTML] • [Style CSS]

float

OPIS

Styl definiuje kierunek oblewania elementu (np. obrazka) przez tekst lub inne elementy.

WARTOŚCI

• none - CSS: 2.1, 2.0, 1.0

bez zmian, wartość domyślna

• left - CSS: 2.1, 2.0, 1.0

element znajduje się po lewej stronie i oblewany jest z prawej strony

• right - CSS: 2.1, 2.0, 1.0

element znajduje się po prawej stronie i oblewany jest z lewej strony

• inherit - CSS: 2.1, 2.0

przejęcie wartości "rodzica", np. float: inherit;

POZOSTAŁE CECHY

• CSS: 2.1, 2.0, 1.0
• dziedziczony: nie
• odpowiednik HTML: align

PRZYKŁADY ZASTOSOWAŃ

• Przykład 1:

<img src="g/tlo.gif" width="50" height="50" alt="" style="float: left;" />
Tekst będzie oblewał element po prawej stronie, a sam element znajdzie 
się po stronie lewej - zgodnie z tym co zadeklarowaliśmy.<br /> Co 
ciekawe, w CSS oblewać można nie tylko obrazki, ale także akapity 
i inne elementy. Pozwala to tworzyć bardzo zaawansowane i ładnie 
poukładane strony z tekstem.

Tekst będzie oblewał element po prawej stronie, a sam element znajdzie się po stronie lewej - zgodnie z tym co zadeklarowaliśmy.
Co ciekawe, w CSS oblewać można nie tylko obrazki, ale także akapity i inne elementy. Pozwala to tworzyć bardzo zaawansowane i ładnie poukładane strony z tekstem.

• Przykład 1:

<style type="text/css"><!--
img { float: none; }
.lewo { float: left; }
.prawo { float: right; }
--></style>