koniec - Kurs HTML i CSS
Selektory pseudoklas CSS / Łączenie selektorówNa koniec warto wspomnieć o jeszcze jednej przydatnej własności selektorów CSS. Jak się można było przekonać, rodzajów selektorów jest bardzo wiele - każdy przeznaczony do innego celu. Co jednak zrobić, jeżeli potrzebujemy w jednej regule stylu zastosować kilka selektorów prostych? Czy jest to w ogóle możliwe? Oczywiście, że tak. Wystarczy po prostu wpisać je jeden po drugim (bez żadnych odstępów) w następującej kolejności: selektor typu lub selektor uniwersalny selektory atrybutów...
Indeks, wyszukiwarka / Automatyczne sortowanieJak już wspomniono, dla poprawnego działania indeksu konieczne jest, aby hasła na liście były ułożone w kolejności alfabetycznej. Można ustawić specjalną opcję, tak aby sortowanie alfabetyczne odbywało się automatycznie: var indeks = new Indeks('indeks'); indeks.wstaw(new Array( ['Hasło 1','adres1'], ['Hasło 2','adres2'], ['Hasło 3','adres3'] ), null, null, true); Ustawienie tej opcji może znacznie wydłużyć generowanie indeksu! Aby wyeliminować tę niedogodność, a jednocześnie nie musieć...
- Czcionki CSS / Wariant liczb czcionki {font-variant-numeric}
...przerw między nimi. Jeżeli widzisz cyfry wyrównane we wszystkich kolumnach, znaczy to, że Twoja przeglądarka radzi sobie z tym lepiej. I na koniec dla porównania ten sam tekst, ale w ogóle bez użycia font-variant-numeric: 1 1 1 1 1 11111 9 9 9 9 9 99999
- Wykazy CSS / Odstęp wyróżnika wykazu {marker-offset}
...określenia tła właściwie dla każdego elementu, a dodatkowo można ustalić, aby nie było ono powtarzane oraz określić dokładną jego pozycję. Na koniec pozostaje tylko wykonanie wolnej przestrzeni z lewej strony punktów wykazu, tak aby zmieściły się tam obrazki markerów - tutaj właśnie można określić dowolny interesujący nas odstęp pomiędzy wyróżnikami wykazu a treścią poszczególnych punktów. Jeżeli chcemy dodatkowo ustalić margines z lewej strony wykazu, możemy to zrobić dodając...
- Menu w CSS / Pionowe menu
...none; margin: 0; padding: 0; } W efekcie uzyskamy: Czcionki Tekst Tło Marginesy Obramowanie W niektórych przeglądarkach nie jest konieczne wstawienie wszystkich powyższych deklaracji, jednak tylko taki zestaw właściwie gwarantuje uzyskanie zamierzonego efektu w każdych warunkach. Teraz mamy już przygotowany teren do właściwej stylizacji. Czcionki Tekst Tło Marginesy Obramowanie ul, ul li { display: block; list-style: none; margin: 0; padding: 0; } ul { width...
- Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego
Jeżeli nie odpowiada nam podstawowy wygląd menu, można go zmienić wykorzystując polecenia CSS. W tym celu w pliku menu.css należy wkleić np.: #menu0 { width: 200px; margin: 10px; padding: 0; } #menu0 dt { background-color: #888; color: #fff; font-weight: bold; text-align: center; cursor: pointer; margin: 10px 0 0 0; padding: 2px; } #menu0 dd { background-color: #eee; color: #000; border-width: 0 1px 1px 1px; border-style: solid; border-color: #888...
KontaktUwaga: Jeżeli nie masz zamiaru zadać pytania związanego z napotkanymi problemami dotyczącymi tworzenia stron WWW, skieruj się od razu na koniec tej strony - znajdziesz tam mój adres e-mail... Skoro to czytasz, znaczy że jednak masz problem i chcesz się z nim zwrócić do mnie. Niestety liczba listów e-mail, dotyczących problemów z tworzeniem stron WWW, która codziennie do mnie trafia, przekracza moje możliwości udzielenia na nie odpowiedzi. Każdy taki problem wymaga odrębnego rozpatrzenia...