arkusze stylów - Kurs HTML i CSS
Wstawianie stylów CSS / Sposoby osadzania stylów CSS...HTML wstawia się znaczniki do kodu źródłowego strony, a następnie dzięki CSS można nadać im potem określony sposób wyświetlania. Sposoby wstawiania stylów do gotowych dokumentów są różne. Nie znaczy to, że jedne są lepsze od drugich. Każdy sposób jest przydatny w innych sytuacjach. Większość witryn stosuje jednocześnie wszystkie z przedstawionych metod osadzania CSS - w zależności od konkretnej potrzeby.
Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki...wyszukiwarki Wieloznacznik (wildcard) Wymagana wiedza Odsyłacze do podstrony Wczytywanie stron do ramki lokalnej Podstawy stylów CSS (m.in. arkusze stylów) Skrypt indeksu, wyszukiwarki Aby wstawić na swoją stronę indeks z dodatkową funkcją wyszukiwarki, postępują według poniższych instrukcji: Utwórz w swoim edytorze HTML nowy dokument. Wklej do niego poniższy kod i zapisz w pliku indeks.js (koniecznie użyj kodowania utf-8): /** * @author Sławomir Kokłowski {@link...
- Menu rozwijane, otwierane, wysuwane / Przykład menu rozwijanego
...HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów Skrypty Aktywne przyciski Aktualizacja Nowe okno
- Menu rozwijane, otwierane, wysuwane / Menu wysuwane
...HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów Skrypty Aktywne przyciski Aktualizacja Nowe okno
- Menu drzewiaste / Skrypt menu drzewiastego
...Kolekcje dokumentów Wyrażenia regularne Wymagana wiedza Zagnieżdżanie wykazów <ul>...</ul> Podstawy odsyłaczy Podstawy stylów CSS (m.in. arkusze stylów i klasy selektorów) Skrypt menu drzewiastego Aby uzyskać menu drzewiaste, utwórz plik tree.css w tym samym katalogu co strona i zapisz w nim: ul.tree { display: block; margin-left: 0; padding-left: 0; } ul.tree ul { display: block; margin-left: 0; padding-left: 0; margin-top: 0; margin-bottom: 0; } ul.tree li...
- Menu rozwijane, otwierane, wysuwane / Czas rozwijania/zwijania
...HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów Skrypty Aktywne przyciski Aktualizacja Nowe okno
- Menu rozwijane, otwierane, wysuwane / Menu otwierane
...HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów Skrypty Aktywne przyciski Aktualizacja Nowe okno Opóźnienie przy otwieraniu/zamykaniu Dla tej wersji menu można dodatkowo zmienić opóźnienie, które występuje bezpośrednio przed rozpoczęciem otwierania oraz zamykania menu. Czas ten jest konieczny, aby posługiwanie się takim menu przez użytkownika mogło przebiegać komfortowo. Zbyt małe...
HTML5 / Priorytet ładowania <img fetchpriority, link fetchpriority, script fetchpriority>...wartość domyślna Na stronie internetowej możemy osadzić wiele zasobów ładowanych z zewnętrznych plików - takich jak: obrazki, skrypty czy arkusze stylów. Aby przyspieszyć proces wczytywania takich elementów, mogą być one ładowane równocześnie. Przeglądarka jednak nie wie, które z nich w każdej spośród tych grup są ważniejsze, a które mniej ważne. W konsekwencji elementy kluczowe dla działania strony mogą zostać załadowane na samym końcu, przez co użytkownik będzie musiał dłużej na...
- Definicje / Arkusz stylów
(style sheet) Zestawienie instrukcji, które precyzują wygląd dokumentu. Arkusze stylów mogą mieć trzy różne pochodzenia: autor, użytkownik i pośrednik użytkownika.
- Jednostki CSS / Czas
Wartości czasów są używane przez słuchowe arkusze stylów (aural). Format wartości czasowej składa się z liczby całkowitej lub rzeczywistej oraz jednostki czasu. Wartość ujemna jest niedozwolona! Jednostkami czasu są: ms - milisekundy (1ms = 0.001s) s - sekundy (1s = 1000ms) Jeśli chcesz szybko przeliczyć wartości pomiędzy różnymi jednostkami czasu, to tutaj możesz skorzystać ze specjalnego generatora. ✅ Rozpocznij przeliczanie jednostek