atrybuty - Kurs HTML i CSS
Selektory atrybutów CSS / Selektor atrybutu o wartości rozpoczynającej się od......(np. atrybut title="..."). "Początek" to określony tekst, którym rozpoczyna się wartość atrybutu. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Podobnie jak w przypadku selektora z łącznikami polecenie to pozwala wybrać element z atrybutem o wartości, która ma na początku wymagany tekst, ale po niej nie musi być już żadnego łącznika. Przykład Jeżeli w arkuszu stylów strony została umieszczona następująca...
- Selektory atrybutów CSS / Selektor atrybutu o wartości kończącej się na...
...HTML (np. atrybut title="..."). "Koniec" to określony tekst, którym kończy się wartość atrybutu. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Przykład Jeżeli w arkuszu stylów strony została umieszczona następująca reguła: p[title$="akapit"] { color: red } to każdy akapit, któremu został nadany atrybut TITLE z wartością, która kończy się na "akapit", powinien mieć kolor czerwony: To jest akapit, któremu...
- Selektory atrybutów CSS / Selektor atrybutu zawierającego określony tekst
...to określony napis, zawierający się w wartości atrybutu, który może zawierać również spacje. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Działa podobnie jak selektor atrybutu z podanym wyrazem, jednak pozwala dopasować nie tylko pełne wyrazy, ale dowolną ich część (np. kilka sylab) czy nawet kilka wyrazów. Przykład Jeżeli w arkuszu stylów strony została umieszczona następująca reguła: p[title*="jest...
- Selektory pseudoklas CSS / Etykieta :target
...być element A posiadający atrybut name="..." [zobacz: Odsyłacz do etykiety i Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Czasami podział serwisu na podstrony jest niewystarczający. Zdarza się, że jeden artykuł jest podzielony dodatkowo na niewielkie sekcje - zbyt małe, aby tworzyć z każdej z nich osobną podstronę. Chcielibyśmy jednak mieć możliwość odesłania czytelnika bezpośrednio do...
- Selektory pseudoklas CSS / Blokada :disabled :enabled
...być pola formularza, którym można przypisać atrybut disabled="..." [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Pola formularza mogą znajdować się w wielu stanach - jednym z nich jest blokada kontrolki. Zablokowane pole w większości przeglądarek wyświetlane jest w formie wyszarzonej. Użytkownik nie może do niego wpisywać żadnego tekstu ani go włączyć (w przypadku kontrolek...
- Selektory pseudoklas CSS / Zaznaczenie :checked
...mogą być pola formularza: wyboru, opcji oraz opcje listy rozwijalnej [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Niektóre z pól formularzy pełnią rolę przełączników - można je zaznaczać i odznaczać. W związku z tym może się okazać przydatne dodatkowe wizualne wyróżnienie tych kontrolek, które użytkownik zaznaczył. Zaznaczenie dla opcji listy rozwijalnej obsługuje tylko...
- Selektory pseudoklas CSS / Korzeń :root
(CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome) :root { cecha: wartość } Wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Każdy dokument HTML ma w drzewie dokumentu dokładnie jeden korzeń, tzn. element najbardziej nadrzędny, który nie ma żadnego rodzica, za to zawiera w sobie (bezpośrednio lub poprzez zagnieżdżenie) wszystkie inne elementy dokumentu. W języku HTML korzeniem jest zawsze element HTML...
- Selektory pseudoklas CSS / Pseudoklasy typu :first-of-type :last-of-type :only-of-type
...dowolny znacznik, przy czym dziecko zawiera się w znaczniku rodzica [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Załóżmy, że mamy na stronie listę definicyjną itp.), która - jak wiemy - składa się ze znaczników terminów (DT) i definicji tych terminów (DD). Chcielibyśmy zmienić sposób formatowania tylko pierwszej definicji listy. Oczywiście można to zrobić nadając mu klasę. Nie...
- Selektory pseudoklas CSS / Pusty element :empty
...{ cecha: wartość } Selektorem może być dowolny znacznik [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Zdarza się, że w dokumencie HTML znajdują się elementy, które nie zawierają żadnej treści, ani dzieci. Możemy mieć z tym do czynienia w przypadku elementów, które z definicji nie posiadają znacznika zamykającego (BR, HR, IMG, INPUT), ale również gdy po prostu nie...
- Selektory pseudoklas CSS / Negacja :not
...atrybutu, klasy/identyfikatora albo dowolna pseuoklasa (z wyjątkiem samej pseudoklasy negacji). Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Wyobraźmy sobie sytuację, kiedy chcemy zmienić kolor całego tekstu na stronie z wyjątkiem np. tabelek. Moglibyśmy to zrobić, przypisując najpierw określony kolor całemu tekstowi, a następnie przywracając kolor domyślny wszystkim tabelom. Łatwiej będzie jednak takie...