Style CSS - Pozycjonowanie

1 Style CSS - Pozycjonowanie ...
Author: Rościsława Skoneczna
0 downloads 2 Views

1 Style CSS - Pozycjonowanie

2 Pozycjonowanie Relatywne Absolutne Ustalone Statyczne NakładanieKadrowanie 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 Ustalone 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

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

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

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 block inline none SEL { display: typ }

    11 Widzialność SEL { visibility: tryb } visibile - widzialnyhidden - niewidoczny

    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-top middle text-bottomtext-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 Ustawienie pionowe super subabc abc sub super sub super - indeks górny bez zmiany wielkości tekstu sub - indeks dolny bez zmiany wielkości tekstu

    16 Ustawienie pionowe top bottomabc bottom abc top 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 / noneustala 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 Lewy bok nie przylega do obrazkaPrzyleganie Prawy bok nie przylega ... Lewy bok nie przylega do obrazka

    (...)

    (...)

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

    (...)

    (...)

    20 abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuRozmiary SEL { width: typ } SEL { height: typ } abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstu height: 20px width: 200px

    21 Bibliografia www.kurshtml.boo.pl - Sławomir KokłowskiKurs HTML - Paweł Wimmer, wyd. Lupus