link stylesheet - Kurs HTML i CSS
HTML5 / Kategorie elementów HTML5...I, IFRAME, IMG, INPUT, INS, KBD, LABEL, LINK (rel="..." z jedną z wartości: dns-prefetch, modulepreload, pingback, preconnect, prefetch, preload, stylesheet), MAIN (jeżeli zawiera się bezpośrednio lub pośrednio tylko w: HTML, BODY, DIV, FORM), MAP, MARK, MENU, META (itemprop="..."), METER, NAV, NOSCRIPT, OBJECT, OL, OUTPUT, P, PICTURE, PRE, PROGRESS, Q, RUBY, S, SAMP, SCRIPT, SEARCH, SECTION, SELECT, SLOT, SMALL, SPAN, STRONG, sub, sup, TABLE, TEMPLATE, TEXTAREA, TIME, U, UL, VAR, VIDEO...
Dobre praktyki / Przykazania webmastera...zbiera najważniejsze odnośniki z całego serwisu. Podobnie coraz częściej powtórzona nawigacja pojawia się w stopce serwisu, ale w odróżnieniu od linków nagłówkowych, może zawierać znacznie więcej odnośników. Oprócz tego stopka jest dobrym miejscem na zaznaczenie praw autorskich i podanie odnośnika do kontaktu. Zapomnij o wstawieniu nawigacji tylko na stronie głównej, a na podstronach samego linku "Powrót do strony głównej". To tylko niepotrzebny klik, a przy tym zmiana układu strony, co...
- XHTML / Typy MIME dokumentów XHTML
...być również serwowane z tym typem, jednak w takim przypadku niektóre przeglądarki mogą ich nie wyświetlić zgodnie z regułami języka XHTML, tzn. np. linki mogą nie być "klikalne"! Domyślny system kodowania znaków to UFT-8 lub UTF-16. Inne kodowanie można określić za pomocą nagłówka HTTP lub deklaracji XML. Deklaracja strony kodowej za pomocą znacznika META nie jest rozpoznawana (w tego typu dokumentach XHTML nie powinno się jej wstawiać)! text/xml Inny ogólny typ przeznaczony dla języka XML...
- Drukowanie CSS / Wydruk @media print
...się ogólne deklaracje) */ /* (...) */ @media print { /* Arkusz dla wydruku */ } Dołączenie specjalnie dla wydruku zewnętrznego arkusza: <head> <link rel="stylesheet" href="domyslny.css"> <link rel="stylesheet" href="wydruk.css" media="print"> </head> Dołączenie specjalnie dla wydruku wewnętrznego arkusza: <head> <style media="print"> /* Arkusz dla wydruku */ </style> </head> [zobacz także rozdział pt.: Media]. UWAGA! Kolejność wpisywania poleceń ma znaczenie, tzn. najpierw...
Przeglądarka zdjęć...do obrazków Podstawy stylów CSS (m.in. arkusze stylów) Odsyłacze do podstrony Przykład przeglądarki zdjęć /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj tego komentarza! (Do NOT remove this comment!) */ function PrzegladarkaZdjec(id, zdjecia) { this.czas = 5; // czas przejścia w trybie pokazu slajdów [sek] this.id = id; this.zdjecia = zdjecia; var timerID = null; this.wyswietl = function(nr)...
- Media CSS / Wybór medium @media
...precyzujący włączenie zewnętrznego arkusza stylów): <!doctype html> <html lang="pl"> <head> <title>Odnośnik do medium docelowego</title> <link rel="stylesheet" media="print, handheld" href="arkusz.css"> </head> <body> <p>Ciało dokumentu...</p> </body> </html> Podanie medium docelowego wewnątrz języka dokumentu (atrybut "media" elementu STYLE precyzujący włączenie wewnętrznego arkusza stylów): <!doctype html> <html lang="pl"> <head> <title>Arkusz z medium...
- Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego
...dokumentu HTML (<head>...</head>), na którym wstawione jest menu, wystarczy wstawić odwołanie do utworzonego właśnie zewnętrznego arkusza stylów: <link rel="stylesheet" href="menu.css"> Przykład 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 new Menu('menu7'); Aby uzyskać następujące wielopoziomowe menu otwierane, imitujące...
- Media CSS / Zapytania mediów
...wyborze medium, np.: @import url(kolor.css) screen and (color); @media screen and (color) { /* Arkusz dla urządzeń z kolorowym ekranem */ } <link rel="stylesheet" media="screen and (color)" href="kolor.css"> Zapytanie mediów składa się ze standardowego typu lub grupy medium, po którym następuje słowo kluczowe "and" (ang. i), a następnie w nawiasie cecha medium (ang. media feature), określająca wymagane możliwości urządzenia w ramach podanego na początku mediów ogólnego. Pomiędzy...
- Wstawianie stylów CSS / Import arkusza stylów @import
...lub zaimportować w wewnętrznym arkuszu. Import arkuszy może również być przydatny, jeśli chcemy oszczędzić wstawiania dodatkowych znaczników <link rel="Stylesheet">. W takim przypadku dołącza się tylko jeden zewnętrzny plik *.css, a w nim importuje pozostałe arkusze. UWAGA! Jeżeli polecenie importu znajduje się w zewnętrznym arkuszu stylów, to relatywną ścieżkę dostępu do arkusza importowanego należy konstruować względem położenia arkusza CSS, w którym jest wstawione polecenie @import...
- Indeks, wyszukiwarka / Wygląd
...HTML (<head>...</head>), na którym wstawiony jest indeks haseł, wystarczy wstawić odwołanie do utworzonego właśnie zewnętrznego arkusza stylów: <link rel="stylesheet" href="indeks.css">