strony - Kurs HTML i CSS
Selektory pseudoklas CSS / Zaznaczenie :checked...obsługuje tylko Firefox. Przykład :checked Po wpisaniu w arkuszu stylów: input:checked, option:checked { margin-left: 30px } a w dowolnym miejscu strony: <form action="?"> <fieldset> <input type="radio" checked name="pole_opcji"> <input type="radio" name="pole_opcji"> </fieldset> <fieldset> <input type="checkbox" checked> <input type="checkbox"> </fieldset> <select size="3"> <option selected>Opcja 1</option> <option>Opcja 2</option> <option>Opcja 3</option>...
- Selektory pseudoklas CSS / Domyślne :default
...wrócić. Przykład :default Po wpisaniu w arkuszu stylów: input:default, option:default, button:default { margin-left: 30px } a w dowolnym miejscu strony: <form action="?"> <fieldset> <input type="radio" checked name="pole_opcji" class="przyklad_domyslne"> <input type="radio" name="pole_opcji" class="przyklad_domyslne"> </fieldset> <select size="3"> <option selected class="przyklad_domyslne">Opcja 1</option> <option class="przyklad_domyslne">Opcja 2</option> <option...
- Tło CSS / Rozmiary tła obrazkowego {background-size}
...do wysokości, zachowując jego proporcje, jako szerokość należy podać wartość "auto" (np. "auto 100px"). Często zależy nam na wstawieniu w tle strony tylko jednego egzemplarza obrazka (bez jego powielania), ale w taki sposób aby idealnie dopasował się do rozmiarów okna przeglądarki - niezależnie od używanej rozdzielczości ekranu. Powyższe polecenie pozwala uzyskać taki efekt i to bez żadnych sztuczek ani obejść. Trzeba jednak pamiętać, że rozciąganie obrazka nie tylko zniekształca jego...
- Układ wielokolumnowy CSS / Multi-column layout
...za pomocą tabel. Ma to jednak spore wady, które praktycznie dyskwalifikują takie rozwiązanie: Inaczej niż w prawdziwym, gazetowym układzie strony, tekst z końca jednej kolumny tabeli nie przechodzi automatycznie na początek kolejnej, umieszczonej po jej prawej stronie. Po zmianie wielkości lub rodzaju czcionki, tekst w kolumnie tabeli ułoży się w zupełnie inny sposób - najprawdopodobniej wysokość przestrzeni zajmowanej przez tekst w kolumnach nie będzie identyczna. Na niewielkich...
- Układ wielokolumnowy CSS / Wypełnienie kolumn {column-fill}
...kolumny tekstu w taki sposób, aby możliwie wszystkie (oprócz ostatniej) miały taką samą wysokość i nie było żadnej wolnej przestrzeni z prawej strony elementu. Oznacza to, że nawet jeśli ustalimy wysokość elementu, kolumny mogą być od niej niższe, jeśli treści nie będzie wystarczająco dużo, aby wypełnić cały element nie tylko na szerokość, ale i na wysokość. W pewnych sytuacjach może nam jednak zależeć, aby wysokość kolumn miała dokładnie tyle, ile określimy, nawet jeśli z prawej strony...
HTML5 / Zmienione elementy i atrybuty HTML5...wartości procentowej, gdy shape="circle". defer Jasno określono, że wywoła załadowanie pliku skryptu osadzonego przy pomocy SCRIPT, kiedy kod strony zostanie w całości wczytany przez przeglądarkę. dir Dodano nową wartość - "auto". enctype Dla znacznika FORM dodano obsługę "text/plain". href Dla elementu LINK nie może zawierać pustej wartości. Dla elementu BASE musi zawierać adres bezwzględny. Dla elementu A może zawierać IRI (od zwykłego adresu URL różni się tym, że może składać...
- HTML5 / Sekcja <section>
...do niego następnego dnia. Dobrym wyznacznikiem, gdzie powinno się wstawić znacznik sekcji, jest zadanie sobie pytania, czy do tego fragmentu strony potencjalnie ktoś chciałby wstawić odsyłacz do etykiety. Dlatego takie sekcje dobrze jest dodatkowo opatrzyć identyfikatorem, do którego będzie się można potem odnosić: <section id="moja-sekcja"> <h1>Moja sekcja</h1> ... </section> (...) Przejdź do: <a href="#moja-sekcja">Moja sekcja</a> Sekcja nie powinna być używana jako ogólny...
- HTML5 / Główna treść <main>
...element MAIN. Powinniśmy nim oznaczyć główną treść każdego dokumentu. Zwykle można ją rozpoznać po tym, że jest bezpośrednio związana z tytułem strony. Znacznikiem MAIN nie należy obejmować żadnych stałych elementów, które powtarzają się w całym serwisie: menu nawigacyjnego, informacji o prawach autorskich, logo serwisu, bannerów, formularzy wyszukiwania itp. Znacznik ten może jednak obejmować linki nawigujące do podsekcji głównej zawartości dokumentu, które nie powtarzają się na innych...
- CSS dla zielonych / Kolor tła oraz tekstu CSS {background-color, color}
...oraz teksu na całej stronie, możemy się posłużyć selektorem body, ponieważ właśnie wewnątrz znacznika <body>...</body> znajduje się cała zawartość strony. Zatem w arkuszu stylów wystarczy umieścić następujący kod: body { background-color: black; color: white; } Zwróć uwagę, że deklaracja stylów, którą ujmuje się w nawiasy klamrowe, składa się tutaj z dwóch linijek. Każda z nich rozpoczyna się od podania tzw. cechy (inaczej własności), po której następuje wartość. Cecha określa, co chcemy...
- CSS dla zielonych / Wyrównanie tekstu CSS {text-align}
...Pytania i odpowiedzi {text-align} Jak wyrównać tekst do lewej CSS? W językach wywodzących się z alfabetu łacińskiego wyrównanie tekstu do lewej strony następuje domyślnie. Zwykle zatem nie ma potrzeby stosowania żadnych dodatkowych poleceń. Wyjątkiem może być sytuacja, gdy na całej stronie ustaliliśmy wcześniej inny sposób wyrównania tekstu - jak np. wyśrodkowanie - ale jednocześnie chcielibyśmy, żeby tylko treść wstawiona w akapitach była jednak ustawiona do lewej strony. W tym celu w...