czas - Kurs HTML i CSS
Kaskadowe Arkusze Stylów / Dlaczego warto używać CSS?Po co w ogóle stosować style CSS? Czy warto poświęcać czas na naukę poleceń, które w większości przypadków istnieją również bezpośrednio w składni HTML? Otóż ja uważam, że warto. Dlaczego? Najważniejsze zalety płynące ze stosowania stylów opiszę poniżej, a jeśli i to Cię nie przekona, radzę poszukać sobie bardziej przydatnego zajęcia (np. szydełkowanie z wykorzystaniem techniki haftu ozdobnego 😉). Style stały się już praktycznie podstawowym narzędziem formatującym. Jeśli poważnie myślisz o...
- Pozycjonowanie CSS / Pozycja ustalona {position: fixed}
...elementu jest zawsze obliczana względem krawędzi okna przeglądarki (obszaru w którym znajduje się strona). Dodatkowo element taki jest nieruchomy podczas przewijania strony, przez co jest on przez cały czas widoczny na ekranie, dokładnie w tym samym miejscu. Daje to zbliżony efekt, jak nieruchome pojedyncze tło. Przykład {position: fixed} Przykład
Podcast HTML / #7 Widżety HTML...takich okienek. Należy jednak pamiętać, że każde okienko wczytuje pełną stronę wraz ze wszystkimi multimediami, co może prowadzić do bardzo długiego czasu ładowania dokumentu, jeśli ramek jest zbyt wiele. Zastosowanie ramek i widżetów Ramki są szczególnie użyteczne dla twórców różnego rodzaju widżetów (ang. widgets), czyli specjalnych gotowych kodów. Przykładami takich widżetów mogą być filmiki z YouTube’a lub posty z Facebooka czy Twittera. Strony wyświetlane wewnątrz ramek nie przejmują...
- Podcast HTML / #9 HTML5
...<mark>: służy do zaznaczenia lub uwydatnienia tekstu w określonym kontekście, np. w wynikach wyszukiwania. <time>: poprawnie oznacza datę i/lub czas, często używany z atrybutem datetime="..." w formacie ustandaryzowanym, nawet jeśli treść znacznika jest podana w formacie czytelnym dla użytkownika. <hgroup>: używany do grupowania nagłówka z podtytułem, tytułem alternatywnym lub sloganem. <wbr>: umożliwia przeglądarce przełamanie długiej linii tekstu do następnego wiersza, jeśli linia nie...
- Tło CSS / Zaczepienie tła obrazkowego {background-attachment}
...jest grafika, przesuwa się ona razem z tekstem, w miarę przewijania treści okna za pomocą suwaka. Możemy jednak sprawić, że tło będzie przez cały czas nieruchome, nawet jeśli będziemy przewijali zawartość strony. Wtedy w wewnętrznym arkuszu stylów strony należy użyć polecenia: body { background-image: url(obrazek.jpg); background-attachment: fixed } Polecenie to ma sens, tylko jeśli określimy równocześnie tło obrazkowe. Różnica pomiędzy wartościami "fixed" a "local" jest taka, że w...
Aktywne przyciski / Pamięć podręczna...o dodatkowych obrazkach aktywnych przycisków, dzięki czemu zostaną one jeszcze przed pierwszym użyciem zapisane w pamięci podręcznej, a więc już podczas ich użycia nie nastąpi żadna zwłoka wywołana doczytywaniem. Ma to sens tylko dla wariantów obrazków w stanie podświetlonym i klikniętym. Używanie tej medoty dla obrazków w stanie podstawowym nie ma żadnego celu, ponieważ każdy obrazek, który jest normalnie umieszczony w kodzie strony - tak jak właśnie wariant podstawowy przycisków...
- Losowy element
...stosowane w wielu portalach, które wymieniają się bannerami i buttonami z innymi serwisami. Pozwala to zaoszczędzić miejsce na stronie i skrócić czas wczytywania, ponieważ za każdym razem ładowany jest tylko jeden obrazek. Aby wstawić na stronę losowy tekst lub obrazek, należy w wybranym miejscu dokumentu wkleić następujący kod: <script> Array.prototype.random = function(limit) { if (typeof limit == 'undefined' || limit < 0) limit = 1; else if (!limit) limit = this.length; for...
- Wyszukiwarka / Wyszukiwanie w podanym serwisie
...serwisu mogło się odbyć, najpierw należy zarejestrować stronę w wyszukiwarce - w tym przypadku Google - a potem należy odczekać pewien czas, aby robot wyszukiwarki zdążył zaindeksować wszystkie podstrony serwisu. Przykład
- Wykaz skryptów / Pozostałe skrypty
...specjalnego obrazka albo napisu. System newsów Automatyczny system wiadomości na stronie WWW, które są wyświetlane tylko przez określony czas. Skrypt posiada masę opcji konfiguracyjnych i atrakcyjny wygląd, a przy tym jest bardzo elastyczny w zastosowaniu. Nowe okno Automatyczne otwarcie nowego okna zaraz po załadowaniu strony albo po kliknięciu w link. Możliwe jest określenie wyglądu nowego okna (rozmiary, paski menu, narzędzi, stanu itd.). [Generator] Galeria zdjec...
- Tło CSS / Rozmiary tła obrazkowego {background-size}
...wpłynie na utratę jakości grafiki. Pamiętaj również, aby nie wstawiać w tle zdjęć o przesadnie dużych wymiarach, ponieważ będą wydłużały czas wczytywania strony. Możliwe jest również określenie kilku wartości rozmiary tła - kiedy wstawiamy w tle więcej niż jeden obrazek: selektor { background-size: rozmiary obrazka 1, rozmiary obrazka 2,... } Przykład {background-size} contain cover 75px 100px 100% 100%