klasy - Kurs HTML i CSS
Kaskadowe Arkusze Stylów / Dlaczego warto używać CSS?...może być bardzo dużo), odnoszące się do wielu elementów, które mają wyglądać tak samo. Bezpośrednio przy elemencie wystarczy podać tylko nazwę klasy i nie musimy już wypisywać "litanii" poleceń. Znacznie przyspiesza to późniejszą modyfikację strony, ponieważ zmian dokonujemy tylko w jednym miejscu, a wpływają one na wiele elementów jednocześnie. Możliwość stosowania różnorodnych jednostek oraz sposobów definiowania kolorów. Style dają autorowi możliwości, które do tej pory były...
- Selektory pseudoklas CSS / Negacja :not
...{ cecha: wartość } Selektorem może być dowolny znacznik [zobacz: Wstawianie stylów]. Argument to jeden z selektorów: typu, uniwersalny, 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ć...
- Selektory atrybutów CSS / Selektor atrybutu o określonej wartości
...border: 1px solid black } Niestety również ta deklaracja nie jest interpretowana przez MSIE 6 🙁. Jedynym rozwiązaniem problemu wydaje się użycie klasy selektorowej dla każdego pojedynczego znacznika pola tekstowego w formularzu. Wtedy przynajmniej będzie można określić wszystkie własności formatowania elementu w jednym miejscu (arkuszu stylów), co znacznie ułatwi i przyspieszy ewentualne późniejsze modyfikacje.
- Drukowanie CSS / Przełamanie strony {page-break-before, page-break-after}
...np. w znacznikach <h1>...</h1>. Możemy wtedy np. w zewnętrznym arkuszu stylów umieścić deklarację: h1 { page-break-before: always } lub z podaniem klasy: h1.tytul { page-break-before: always } Dzięki temu każdy rozdział rozpocznie się na nowej stronie, co sprawi, że treść będzie wyglądała bardziej estetycznie. Takie rozwiązanie nie jest jednak zbyt odpowiednie, jeśli strona zawiera bardzo krótkie rozdziały, ponieważ wtedy wydruk będzie składał się większej ilości stron, które nie będą...
Menu rozwijane, otwierane, wysuwane / Pozycja absolutna...dodając dodatkowe deklarację CSS: 'position: absolute; left: 10px; top: 100px'. Zamiast wpisywać wprost deklaracje CSS, można podać tylko nazwę klasy CSS: <script> new Menu('menu0', 'menu'); </script> a deklaracje przenieść do arkusza stylów: .menu { position: absolute; left: 10px; top: 100px; } Ponieważ menu otworzy się ponad innymi elementami strony, należy zadbać, aby posiadało ustawione tło. W przeciwnym razie będzie nieczytelne! Przykład Wskaż poniższy nagłówek menu...
Manipulacja instancją obiektu w JavaScript - Object.prototype / Przekształcanie obiektu na tekst - toStringObject.prototype.toString() Wartość: String - wartość będąca połączeniem tekstów: "[object " + nazwa klasy + "]" Funkcja toString jest wywoływana automatycznie zawsze wtedy, gdy oczekiwana jest wartość tekstowa, a przekazano obiekt. Przykład Object.prototype.toString new Object().toString(); // "[object Object]" new Object() + ""; // "[object Object]" Object.prototype.toString.call(undefined); // "[object Undefined]...
- Tło CSS / Atrybuty mieszane tła {background}
...Po lewej stronie tego tekstu znajduje się obrazek, który został wstawiony automatycznie... Uwaga: Pogrubiona wartość 110 w deklaracji klasy powyżej, odpowiada za przesunięcie tekstu w prawo i nie powinna być ona mniejsza od szerokości obrazka (w pikselach), aby nie był on zasłonięty! Wielokrotne atrybuty mieszane (CSS 3 - interpretuje Firefox, Opera, Chrome) selektor { background: wartości atrybutów obrazka 1, wartości atrybutów obrazka 2... } Korzystając z rozszerzonej...
- Kolory CSS / Sposoby definiowania kolorów CSS
...0, 0, 0). Wartość ta przydaje się, kiedy chcemy odwołać wcześniejsze ustawienie koloru, który został odziedziczony albo przypisany np. przy pomocy klasy selektorów. W takiej sytuacji proste usunięcie wcześniejszej deklaracji koloru może być niemożliwe albo utrudnione. currentColor - kolor taki sam jak ma tekst aktualnego elementu (czyli wartość cechy color ustawionej bezpośrednio albo odziedziczonej). Jest to bardzo wygodny sposób na przypisanie np. identycznego koloru obramowania co...
- Selektory CSS
...jest odpowiednio: n-tym dzieckiem jego rodzica, n-tym dzieckiem licząc od końca, n-tym bratem typu E, n-tym bratem typu E licząc od końca Pseudoklasy cykliczne 3 E:first-child element E, który jest pierwszym dzieckiem jego rodzica Pierwsze dziecko 2 E:last-child element E, który jest ostatnim dzieckiem jego rodzica Ostatnie dziecko 3 E:only-child element E, który jest jedynym dzieckiem jego rodzica Jedyne dziecko 3 E:first-of-type E:last-of-type E:only-of-type...