logo-tworzenie-stron-legnica

config

Style CSS

Spis alfabetyczny stylów CSS.

Ściąga CSS - przykłady, style CSS alfabetycznie, spis stylów CSS, właściwości CSS, skorowidz stylów CSS.


 

Strona w trakcie modernizacji

Zapraszamy wkrótce

Właściwość CSS overflow

Definicja stylu, przeznaczenie i użycie overflow

Właściwość overflow (przepełnienia) określa, co powinno się stać, jeśli zawartość przepełni pole elementu.

Ta właściwość określa, czy należy przyciąć zawartość elementu HTML, czy też dodać paski przewijania, jeśli zawartość elementu jest zbyt duża, aby zmieścić się w określonym obszarze.

Uwaga: Właściwość przepełnienia działa tylko w przypadku elementów blokowych o określonej wysokości (height).

Wartości właściwości overflow

Wartość Opis
visible Obszar przepełnienia nie jest przycięty. Renderuje poza ramką elementu i jest widoczny. Ustawienie domyślne.
hidden Przepełnienie zostanie przycięte i ten obszar zawartości elementu HTML będzie niewidoczny.
scroll Przepełnienie jest przycięte, ale dodawany jest pasek przewijania. Korzystając z niego można zobaczyć pozostałą zawartość.
auto Jeśli przepełnienie jest obcięte, dodawany jest pasek przewijania, aby zobaczyć resztę treści.
initial Ustawia tę właściwość na jej wartość domyślną.
inherit Dziedziczy tę właściwość z elementu nadrzędnego.

Składnia CSS overflow

overflow: visible | hidden | scroll | auto |initial | inherit;

Wsparcie przeglądarek dla właściwości overflow

Liczba w tabeli określa pierwszą wersję przeglądarki w pełni obsługującą tę właściwość.

Właściwość chrome edge firefox safari opera
overflow 1.0 4.0 1.0 1.0 7.0

Uwaga: W systemie OS X Lion (na Macu) paski przewijania są domyślnie ukryte i wyświetlane tylko wtedy, gdy są używane (nawet jeśli ustawiono opcję overflow: scroll).

 

Przykładowe zastosowania z właściwością overflow

Kliknij wartości właściwości poniżej, aby zobaczyć wynik.

Właściwość CSS:
overflow:

 
Rezultat:

Spróbuj z różnymi wartościami właściwości overflow.

Aby zademonstrować różne wartości właściwości, ten tekst jest powtarzany kilka razy.

Spróbuj z różnymi wartościami właściwości overflow.

Aby zademonstrować różne wartości właściwości, ten tekst jest powtarzany kilka razy.

Spróbuj z różnymi wartościami właściwości overflow.

Aby zademonstrować różne wartości właściwości, ten tekst jest powtarzany kilka razy.

Spróbuj z różnymi wartościami właściwości overflow.

Aby zademonstrować różne wartości właściwości, ten tekst jest powtarzany kilka razy.

Kod CSS:
div {
    overflow:visible;
}
 

 

Przykłady właściwości overflow

overflow: scroll;

overflow: hidden;

overflow: auto;

overflow: visible;

 

Witold Czuba Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony , , Marynarska 54, 59-220, Legnica, dolnośląskie, Polska, tel. +48 780 060 995, Pon. - pt. 8:00 - 17:00

 

 

Witold Czuba

Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony

Marynarska 54
59-220, Legnica,
dolnośląskie, Polska,
tel. +48 780 060 995,
Pon. - pt. 8:00 - 17:00