klasy - Kurs HTML i CSS
- Selektory specjalne CSS / Klasy selektorów <... class>
...polskich liter. Nie może się on również rozpoczynać cyfrą ani myślnikiem. Jeśli koniecznie chcemy użyć "zakazanych" znaków, należy w deklaracji klasy poprzedzić je odwróconym ukośnikiem "\", np. reguła: selektor.B\&W\? { cecha: wartość } 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...
- CSS dla zielonych / Klasy selektorów CSS <div class>
...class: <div class="menu-nawigacyjne">...</div> Następnie w arkuszu stylów w miejsce selektora wstawiamy wartość atrybutu class - czyli nazwę klasy - poprzedzoną znakiem kropki: .menu-nawigacyjne { background-color: gray; color: silver; } Zwróć uwagę, że w kodzie HTML wartość atrybutu class nie zawiera znaku kropki - trzeba ją dodać tylko w arkuszu stylów. Należy jednak pamiętać, że pomiędzy znakiem kropki a nazwą klasy w selektorze nie może być żadnych białych znaków - nawet...
- Dobre praktyki / CSS Zorientowane Obiektowo
...o stylizację, nie ma znaczenia, ile punktów ma wykaz, ponieważ wygląd dla nich określamy wspólnie) odnośnik a W arkuszu CSS pełna definicja tej klasy może wyglądać na przykład tak: .Menu { background-color: white; } .Menu ul, .Menu li { display: block; list-style: none; margin: 0; padding: 0; } .Menu li { float: left; margin-right: 1em; } .Menu a { color: blue; text-decoration: none; } Kompozycja Zwróćmy uwagę, że typowy artykuł może zawierać informacje o...
- CSS dla zielonych / Ramki z tekstem CSS {background-color, padding, padding-top, padding-bottom, padding-left, padding-right, border-width, border-style, border-color, border-radius}
...mogą być np. ramki wizualnie wyróżniające tekst, który się w nich znajduje. Wystarczy, że raz zdefiniujemy ich wygląd w arkuszu stylów: .nazwa-klasy { deklaracje stylów } by następnie w miarę potrzeb móc ich wielokrotnie używać w dowolnym dokumencie HTML na naszej stronie: <div class="nazwa-klasy">dowolny tekst...</div> Przypominam, że w arkuszu stylów (pierwsze polecenie powyżej) nazwa-klasy musi być poprzedzona znakiem kropki (w tym miejscu po kropce nie można postawić spacji!)...
- Dobre praktyki / Przykazania webmastera
...Minimalizuj liczbę identyfikatorów i klas CSS Pozwoli to na łatwiejsze zarządzanie arkuszem CSS (prościej jest pamiętać jedną nazwę klasy niż kilkanaście jej odmian) oraz zmniejszy prawdopodobieństwo powstania konfliktów nazw i związanej z tym konieczności wymyślania kolejnej, nowej nazwy, kiedy już skończyły nam się wszystkie pomysły. W tym celu możesz nadać jedną klasę blokowi pełniącemu rolę pojemnika na elementy innych typów, a dalej korzystać np. z selektorów potomka...
- Komendy HTML 4.01 / APPLET
...po prawej top - na górze ALT="tekst" Tekst alternatywny ARCHIVE="adresy" Lista adresów archiwów rozdzielonych przecinkami, które zawierają klasy i zasoby, które zostaną przeładowane CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami CODE="adres" Lokalizacja pliku klas CODEBASE="adres" Określa adres bazowy HEIGHT="długość" Wysokość w pikselach lub w procentach HSPACE="piksele" Odstęp po lewej i prawej stronie w...
- Menu drzewiaste / Skrypt menu drzewiastego
...Wyrażenia regularne Wymagana wiedza Zagnieżdżanie wykazów <ul>...</ul> Podstawy odsyłaczy Podstawy stylów CSS (m.in. arkusze stylów i klasy selektorów) Skrypt menu drzewiastego Aby uzyskać menu drzewiaste, utwórz plik tree.css w tym samym katalogu co strona i zapisz w nim: ul.tree { display: block; margin-left: 0; padding-left: 0; } ul.tree ul { display: block; margin-left: 0; padding-left: 0; margin-top: 0; margin-bottom: 0; } ul.tree li { display: block...
- Selektory specjalne CSS / Selektor identyfikatora <... id>
...atrybutów formatowania dla elementu, który ma jednoznaczny identyfikator (ID), czyli występuje tylko raz w drzewie dokumentu (w odróżnieniu od klasy). Przykład <... id> Jeżeli w arkuszu stylów strony została umieszczona następująca reguła: p#przyklad_identyfikator { color: red } to akapit o podanym identyfikatorze ID: <p id="przyklad_identyfikator">To jest akapit.</p> zostanie wyświetlony w kolorze czerwonym: To jest akapit. Dla porównania, to też jest akapit, ale bez podania...
- Selektory pseudoklas CSS / Łączenie selektorów
...(bez żadnych odstępów) w następującej kolejności: selektor typu lub selektor uniwersalny selektory atrybutów, selektor identyfikatora, selektor klasy lub selektory pseudoklas (w dowolnej kolejności) selektory pseudoelementów Zespół selektorów z punktu 1 i 2 nazywamy selektorem prostym. W jednej regule może wystąpić kilka selektorów prostych - każdy rozdzielony przez tzw. kombinator, tj. znaki spacji, ">" lub "+", które są wykorzystywane przy tworzeniu selektorów: potomka, dziecka i...
- Obsługa błędów w JavaScript - Error / Tworzenie nowego błędu - new Error
Spis treści new Error new Error Utworzenie własnej klasy wyjątku new Error new Error() new Error(message) Parametry: String message - komunikat błędu (domyślnie: "") Wartość: Error - nowa instancja obiektu błędu Tworzy nową instancję obiektu błędu. Zwykle wykorzystuje się ją do rzucania wyjątków. Utworzenie własnej klasy wyjątku Jeżeli chcesz, aby Twój program obsługiwał dodatkowe błędy, zdefiniuj własną klasę wyjątku, która dziedziczy po wbudowanej klasie Error: var TestError...