dokumentu - Kurs HTML i CSS
HTML5 / Element bierny <... inert>...w polach formularzy ani elementach z atrybutem contenteditable="true". Zawartość, tak oznaczonego elementu, jest ignorowana podczas przeszukiwania dokumentu (skrót klawiaturowy Ctrl+F). Do skryptów JavaScript nie docierają z niego zdarzenia "click" ani "focus". Element i cała jego zawartość mogą być zignorowane przez technologie zwiększające dostępność strony. Przykładowym zastosowaniem tego atrybutu może być tymczasowe usunięcie interaktywności dynamicznym elementom strony, które...
- HTML5 / Osadzenie kodu HTML w ramce lokalnej <iframe srcdoc>
...w ramce IFRAME? Atrybut srcdoc="..." w ramce <iframe> pozwala na bezpośrednie osadzenie kodu HTML wewnątrz ramki, zamiast ładowania zewnętrznego dokumentu przez atrybut src="...". Umożliwia to wyświetlanie statycznej zawartości bez konieczności tworzenia osobnego pliku HTML. Przykład: <iframe srcdoc="<p>Witaj, świecie!</p>"></iframe> wyświetli w ramce akapit z tekstem "Witaj, świecie!". Czy srcdoc="..." jest bezpieczny? Użycie srcdoc="..." jest bezpieczne, pod warunkiem że...
- HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
...atrybut sandbox i w ten sposób pozbyć się wszystkich nałożonych na nią ograniczeń. Chociaż ramki lokalne zapewniają wizualną izolację od reszty dokumentu (nie powinny popsuć jego wyglądu), to potencjalnie nadal w pewnym stopniu mogą być niebezpieczne. Oczywiście sami raczej nie zaatakujemy użytkownika serią wyskakujących okienek ani świadomie nie zainstalujemy mu konia trojańskiego czy wirusa. Nie zawsze jednak mamy pełną kontrolę nad wyświetlaną u nas treścią. Możemy chcieć osadzić na...
Kaskadowe Arkusze Stylów / Dlaczego warto używać CSS?...każdy nowy akapit (normalny znak tabulatora wpisany w kodzie źródłowym strony, jest ignorowany przez przeglądarkę internetową, podczas wyświetlania dokumentu). Odstęp pomiędzy literami w tym paragrafie został powiększony. Nowe własności tła Przykład Tło pod tekstem Powtarzanie tła w poziomie Kliknij tutaj, aby zobaczyć przykład strony z nieruchomym pojedynczym tłem. Gradient (płynne przejście kolorów) Obramowanie Przykład Obramowanie tekstu Zaokrąglone narożniki Cień pod...
- Wstawianie stylów CSS / Import arkusza stylów @import
...dostępu do arkusza importowanego należy konstruować względem położenia arkusza CSS, w którym jest wstawione polecenie @import, a nie względem dokumentu HTML! Wszystkie polecenia importu (może ich być kilka) muszą się znajdować zaraz na początku arkusza stylów, tzn. przed właściwymi regułami CSS, znajdującymi się w arkuszu, do którego następuje import! Pliki arkuszy stylów mogą mieć negatywny wpływ na szybkość wczytywania strony. Jeśli chcesz się dowiedzieć, w jaki sposób zoptymalizować...
- Selektory elementów CSS / Selektor typu
...Tutaj będą przedstawione jedynie selektory. Selektor typu jest podstawowym rodzajem selektora. Pozwala on wybrać pojedynczy zwykły element dokumentu HTML podanego typu, czyli o określonej nazwie, a następnie nadać mu atrybuty (za pomocą cechy oraz wartości - opisane w następnych rozdziałach). Można powiedzieć, że selektor ten to inaczej element (znacznik), występujący w kodzie źródłowym strony. UWAGA! W języku XHTML wszystkie selektory muszą być pisane małymi literami. Przykład...
- Selektory elementów CSS / Selektor braci
brat1 + brat2 { cecha: wartość } gdzie wyrazy "brat1" oraz "brat2" są selektorami typu, przy czym leżą one w tym samym rzędzie hierarchii drzewa dokumentu [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu i zostaną opisane w dalszych rozdziałach. Selektor ten umożliwia nadanie określonych atrybutów jednemu z sąsiadujących ze sobą braci - temu, który w deklaracji został podany jako drugi (czyli brat2). Zwykły tekst znajdujący się pomiędzy braćmi...
- Selektory elementów CSS / Grupowanie selektorów
...deklaracja stylu pozwala nadać te same wartości atrybutów kilku różnym selektorom jednocześnie (bez względu na ich położenie w hierarchii drzewa dokumentu). Oznacza to, że zamiast wpisywać kilka razy te same deklaracje, wystarczy wymienić dowolną liczbę selektorów po przecinku i jednorazowo przypisać im wszystkim ten sam styl. Przykład Jeśli w arkuszu stylów strony została umieszczona następująca reguła: b, i { color: red } to po wpisaniu: <b>pogrubienie</b> <i>pochylenie</i> otrzymamy...
- Selektory elementów CSS / Ogólny selektor braci
...brat1 ~ brat2 { cecha: wartość } gdzie wyrazy "brat1" oraz "brat2" są selektorami typu, przy czym leżą one w tym samym rzędzie hierarchii drzewa dokumentu [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu i zostaną opisane w dalszych rozdziałach. Selektor ten umożliwia nadanie określonych atrybutów wszystkim braciom - tym, których typ w deklaracji został podany jako drugi (czyli brat2). Zwykły tekst znajdujący się pomiędzy braćmi nie ma...
- Selektory specjalne CSS / Klasy selektorów <... class>
...odpowiada klasie: class="B&W?". Zdefiniowanie klasy selektorów w części arkuszu stylów, pozwala później się do niej odnosić już we właściwej treści dokumentu. Dzięki temu możemy np. ustalić określone atrybuty dla danego elementu (selektora) na całej stronie, a jednocześnie zmienić wygląd tylko niektórych, bezpośrednio przy nich. Nie musimy już wtedy za każdym razem wpisywać stylu inline, którego zapis czasem może być dosyć długi, ale wystarczy odwołać się do nazwy klasy z arkusza. Deklaracja...