class - Kurs HTML i CSS
- 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}
...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!), podczas gdy w kodzie HTML (drugie polecenie powyżej) znak kropki koniecznie trzeba usunąć. Ponadto w nazwie klasy najlepiej używać wyłącznie...
- Przeglądarka zdjęć
...nr ? ' selected' : '') + '>' + zdjecia[i][1] + '</option>'; } document.write( '<form action="javascript:void(0)" id="' + this.id + '" class="zdjecia">' + '<div class="zdjecia_menu">' + '<input type="button" name="poczatek" value="|<<"' + (nr == 0 ? ' disabled' : '') + ' title="Początek" onclick="' + this.id + '.wyswietl(0)" onkeypress="' + this.id + '.wyswietl(0)">' + '<input type="button" name="wstecz" value=" << "' + (nr == 0 ? ' disabled' : '')...
- Obramowanie CSS / Obramowanie obrazkowe {border-image-source}
...zostanie powielony w pionie, więc wystarczy, żeby miał wysokość 1px): Wykonanie ramki graficznej wymaga użycia następujące go kodu HTML: <div class="ramka"> <div class="ramka_pojemnik"> <div class="ramka_zawartosc"> ... </div> </div> </div> ...oraz CSS: .ramka { background: url(obramowanie.gif) no-repeat top; padding-top: 12px; width: 200px; } .ramka_pojemnik { background: url(obramowanie2.gif) no-repeat bottom; padding-bottom: 12px; } .ramka_zawartosc { background...
- Selektory pseudoklas CSS / Szczegółowość selektorów
...decyduje liczba użytych w regule klas, pseudoklas oraz atrybutów. Przykład Tekst przedstawionego poniżej akapitu będzie czerwony (red): <p class="klasa">...</p> p.klasa { color: red } p { color: black } Gdy w rozpatrywanych selektorach zarówno liczba identyfikatorów jak i klas, pseudoklas oraz atrybutów jest identyczna, bardziej szczegółowy (ważniejszy) jest selektor, który posiada więcej elementów lub pseudoelementów. Przykład Tekst przedstawionego poniżej akapitu będzie...
- Selektory specjalne CSS / Selektor identyfikatora <... id>
...identyfikatorze id="demo" w CSS, używa się selektora identyfikatora. Na przykład: #demo { font-weight: bold; }. Kiedy CLASS a kiedy ID? Klasy (class="...") stosuje się, gdy chcemy zastosować te same style do wielu elementów o podobnych właściwościach. Natomiast identyfikatory (id="...") stosuje się, gdy chcemy zastosować unikalne style lub manipulacje do jednego konkretnego elementu na stronie.
- Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego
...przyciski Aktualizacja Nowe okno new Menu('menu11', 'position: absolute; left: 300px', true, true, -1, -1, -1, -1, true); Kod HTML: <div class="menu"> <dl id="menu1"> <dt>HTML</dt> <dd><a href="...">...</a></dd> <dd><a href="...">...</a></dd> </dl> <script> new Menu('menu1', 'position: absolute', true, true, -1, -1, -1, -1, true); </script> <dl id="menu2"> <dt>CSS</dt> <dd><a href="...">...</a></dd> <dd><a href="...">...</a></dd> </dl> <script>...
- Komendy HTML 4.01 / Wykaz atrybutów
...Dla pól typu 'radio' i 'checkbox' cite BLOCKQUOTE, Q Adres dla dokumentu źródłowego lub wiadomości cite DEL, INS Informacja o zmianie class Wszystkie elementy oprócz BASE, BASEFONT, HEAD, HTML, META, PARAM, SCRIPT, STYLE, TITLE Lista klas rozdzielonych odstępami classid OBJECT Identyfikuje implementację clear BR Kontroluje przepływ tekstu code APPLET Plik klasy apletu codebase APPLET Opcjonalny adres bazowy dla apletu codebase OBJECT Adres bazowy dla...
- Komendy HTML 4.01 / A
Definiuje kotwicę (odsyłacz, etykieta). Zobacz więcej... Atrybuty: ACCESSKEY="znak" Przypisuje klawisz dostępu do elementu CHARSET="kodowanie" Określa sposób kodowania znaków zasobu, wyznaczonego przez odsyłacz CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami COORDS="współrzędne" Podaje współrzędne obszaru w mapie odnośników klienta (MAP), które zależą od kształtu obszaru (atrybut SHAPE): x,y,r - (SHAPE="circle" - koło)...
- Komendy HTML 4.01 / ABBR
Wskazuje formę skróconą. Zobacz więcej... Atrybuty: CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami DIR="kierunek" Kierunek tekstu: ltr - od lewej do prawej rtl - od prawej do lewej ID="nazwa" Przypisuje nazwę elementowi (identyfikator), która nie może się powtarzać w całym dokumencie LANG="język" Informacja o języku bazowym (np.: LANG="en" oznacza angielski, LANG="pl" - polski itd.) STYLE="styl" Informacje stylów...
- Komendy HTML 4.01 / ACRONYM
Wskazuje akronim - wyraz powstały z pierwszych liter innych wyrazów. Atrybuty: CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami DIR="kierunek" Kierunek tekstu: ltr - od lewej do prawej rtl - od prawej do lewej ID="nazwa" Przypisuje nazwę elementowi (identyfikator), która nie może się powtarzać w całym dokumencie LANG="język" Informacja o języku bazowym (np.: LANG="en" oznacza angielski, LANG="pl" - polski itd.)...