Pobieranie prezentacji. Proszę czekać

Pobieranie prezentacji. Proszę czekać

Style CSS - Pozycjonowanie. Pozycjonowanie Relatywne Absolutne Ustalone Statyczne Nakładanie Kadrowanie Wyświetlanie Widzialność Ustawienie Przyleganie.

Podobne prezentacje


Prezentacja na temat: "Style CSS - Pozycjonowanie. Pozycjonowanie Relatywne Absolutne Ustalone Statyczne Nakładanie Kadrowanie Wyświetlanie Widzialność Ustawienie Przyleganie."— Zapis prezentacji:

1 Style CSS - Pozycjonowanie

2 Pozycjonowanie Relatywne Absolutne Ustalone Statyczne Nakładanie Kadrowanie Wyświetlanie Widzialność Ustawienie Przyleganie Rozmiary Bibliografia

3 Relatywne SEL { position: relative; parametry } left/right/top/bottom: odległość od lewej/prawej/górnej/dolnej krawędzi położenia spoczynkowego left: 1cm; top: -10px

4 Absolutne SEL { position: absolute; parametry } left/right/top/bottom: odległość od lewej/prawej/górnej/dolnej krawędzi strony left: 1cm; bottom: 30px

5 SEL { position: fixed; parametry } left/right/top/bottom: stała odległość od lewej/prawej/górnej/dolnej krawędzi przeglądarki left: 10px; top: 3cm Ustalone

6 Statyczne style="position: static" przywraca normalne pozycjonowanie

7 Nakładanie SEL { position: typ; parametry; z-index: nr} ustalenie kolejności nakładania się X Y

8 Kadrowanie SEL { position: absolute; clip: rect(góra, prawo, dół, lewo) } auto == nie tnij position: absolute; clip: rect(25px, auto, 40px, 10px)

9 Wyświetlanie SEL { display: typ } block - element będzie wyświetlony w bloku (odstęp z góry i z dołu) inline - element będzie wyświetlony w linii (sąsiadująco z innymi) list-item - przywraca domyślne wyświetlanie dla elementu wykazu none - element nie będzie wyświetlony

10 Wyświetlanie blockinlinenone SEL { display: typ }

11 Widzialność SEL { visibility: tryb } hidden - niewidocznyvisibile - widzialny

12 Ustawienie poziome (pływanie) SEL { float: tryb } left right none

13 Ustawienie pionowe SEL { vertical-align: tryb } baseline - wyrównuje linię bazową elementu do linii bazowej elementu nadrzędnego (domyślnie) text-top / middle / text-bottom super / sub top / bottom

14 Ustawienie pionowe text-toptext-bottommiddle text-top - szczyt elementu = szczyt tekstu elementu nadrzędnego middle - ustawia element na środku wysokości elementów sąsiadujących text-bottom - podstawa elementu = podstawa tekstu elementu nadrzędnego

15 sub abc Ustawienie pionowe super abc supersub super - indeks górny bez zmiany wielkości tekstu sub - indeks dolny bez zmiany wielkości tekstu

16 Ustawienie pionowe top abc bottom abc bottom top - szczyt el. = szczyt najwyższego elementu linii, w której się znajduje bottom - podstawa el. = podstawa elementu położonego najniżej w linii, w której się znajduje

17 Przyleganie SEL { clear: typ } left / right / both / none ustala pozycję elementów sąsiadujących względem elementu pływającego (np. obrazka). Określa które krawędzie elementu następującego po elemencie pływającym nie będą do niego przylegać.

18 Przyleganie (...) Lewy bok nie przylega do obrazka (...) Prawy bok nie przylega...

19 Przyleganie (...) Żaden bok nie przylega do obrazka (...) Dowolność przylegania

20 Rozmiary SEL { width: typ } SEL { height: typ } abcdefghijkl mnopqrstuv wxyzabcdef ghijklmnopq rstuvwxyza bcdefghijkl mnopqrstuv wxyzabcdef ghijklmnopq rstuvwxyz abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstu width: 200px height: 20px

21 Bibliografia - Sławomir Kokłowski Kurs HTML - Paweł Wimmer, wyd. Lupus


Pobierz ppt "Style CSS - Pozycjonowanie. Pozycjonowanie Relatywne Absolutne Ustalone Statyczne Nakładanie Kadrowanie Wyświetlanie Widzialność Ustawienie Przyleganie."

Podobne prezentacje


Reklamy Google