Co oznaczają elementy stałe w Tumblr?

Co oznaczają elementy stałe w Tumblr?

W motywach Tumblr „elementy stałe” (fixed elements) to elementy, które nie przemieszczają się wraz z przewijaniem strony – pozostają w tym samym miejscu względem okna przeglądarki. Najczęściej spotyka się je w postaci bocznego paska, nagłówka lub stopki.

HTML i CSS w motywach Tumblr

Każdy motyw Tumblr składa się z kodu HTML (struktura) oraz CSS (styl). W przeciwieństwie do wielu stron, w Tumblr HTML i CSS są zazwyczaj połączone w jednym pliku, dostępnym w panelu edycji.

Jak znaleźć CSS swojego motywu?

1. Zaloguj się na konto Tumblr.
2. Na pulpicie kliknij ikonę koła zębatego → Ustawienia.
3. Wybierz blog, którego motyw chcesz edytować.
4. W sekcji Motyw kliknij Dostosuj, a potem Edytuj HTML. Zobaczysz cały kod HTML i CSS.

Wyszukiwanie elementów stałych

W edytorze kodu użyj skrótu Ctrl + F i wpisz position: fixed (lub position:fixed bez spacji). Każde wystąpienie wskaże, które selektory mają ustawioną pozycję stałą, np. #sidebar{position:fixed;}.

Ustawianie położenia elementu

Po określeniu, że element jest stały, możesz ustawić odległość od krawędzi okna przeglądarki, podając właściwości top, right, bottom i left w pikselach. Przykład:

#sidebar{position:fixed; top:20px; right:10px;}

Spowoduje to umieszczenie paska bocznego 20 px od górnej krawędzi i 10 px od prawej.

Zmiana typu pozycjonowania

Jeśli chcesz, aby element nie był już stały, możesz użyć innych wartości właściwości position:

• static – domyślne położenie w normalnym przepływie dokumentu.
• relative – pozycjonowanie względem własnego miejsca; pozwala przesunąć element przy pomocy top, right itd.
• absolute – element zostaje wyjęty z przepływu i pozycjonowany względem najbliższego elementu z pozycją relative lub absolute.

Eksperymentując z tymi ustawieniami, możesz dowolnie modyfikować, które elementy w Twoim motywie będą stałe, a które będą się przewijać.