style - Kurs HTML i CSS
- Komendy CSS 2 / outline
WARTOŚĆ [ <'outline-color'> || <'outline-style'> || <'outline-width'> ] | inherit OPIS Atrybuty mieszane obrysu INICJALIZACJA zobacz cechy indywidualne ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE nie PROCENTY nie MEDIA visual, interactive
- Przeglądarka zdjęć
...name="auto"' + (auto ? ' checked' : '') + ' id="' + this.id + '__auto" onclick="' + this.id + '.przewin()" onkeypress="' + this.id + '.przewin()" style="vertical-align: middle"> <label for="' + this.id + '__auto">Pokaz slajdów</label></div>' + '</div>' + '<img id="' + this.id + '__img" src="' + zdjecia[nr][0] + '" alt="" title="Dalej..." onclick="' + this.id + '.wyswietl(document.getElementById(\'' + this.id + '\').elements[\'zdjecia\'].selectedIndex + 1)">' + '<div...
- Komendy CSS 2 / border
WARTOŚĆ [ <'border-width'> || <'border-style'> || <kolor> ] | inherit OPIS Atrybuty mieszane obramowania INICJALIZACJA zobacz cechy indywidualne ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE nie PROCENTY nie MEDIA visual
- Tekst HTML / Pozioma linia <hr>
...się z dwóch przylegających do siebie kresek o grubości jednego piksela każda. Aby tę wartość podwoić, można posłużyć się następującym kodem: <hr style="border-width: 2px">.
- Odsyłacze HTML / Odsyłacz obrazkowy <a href, img>
...w takim menu! Przykład <a href, img> Kliknij na tym przycisku: Aby usunąć obramowanie wokół obrazka, należy wpisać: <a href="..."><img src="..." style="border: 0" alt="tekst alternatywny"></a> Przykład <a href, img "border">
- Tabele HTML / Łączenie wierszy tabeli w grupy <thead, tbody, tfoot>
...komórek należy utworzyć dodatkowy znacznik TBODY, który nie musi posiadać żadnych atrybutów. Przykład <tbody> Po wpisaniu: <table> <tbody style="background-color: red"> <tr> <td>komórka1</td> <td>komórka2</td> <td>komórka3</td> </tr> <tr> <td>komórka4</td> <td>komórka5</td> <td>komórka6</td> </tr> </tbody> <tbody> <tr> <td>komórka7</td> <td>komórka8</td> <td>komórka9</td> </tr> </tbody> </table> otrzymamy: komórka1 komórka2 komórka3 komórka4 komórka5...
- Odsyłacze HTML / Do etykiety <a id>
Etykieta - inaczej zakładka lub kotwica (ang. anchor) - to pewne zaznaczone miejsce na stronie. Jeśli zdefiniujemy taką zakładkę, będziemy mogli się później do niej bezpośrednio przenosić. Etykiety są wykorzystywane, gdy w jednym dokumencie znajduje się więcej ważnych miejsc - podrozdziałów, a wstawienie ich do osobnych plików, byłoby uciążliwe, ze względu na ich liczbę. Tak jak w książce - każdy rozdział składa się z mniejszych podrozdziałów - tak samo na każdej osobnej stronie HTML definiuje...
- Selektory pseudoklas CSS / Pseudoklasy cykliczne :nth-child :nth-last-child :nth-of-type :nth-last-of-type
...(to samo co: 2n+1) even elementy parzyste (to samo co: 2n) Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. W celu poprawienia czytelności danych, często spotyka się obszerne tabele, w których kolejne nieparzyste wiersze są pokolorowane w odmienny sposób niż parzyste. Taki rodzaj formatowania można oczywiście uzyskać dodając co drugiemu wierszowi odpowiednią klasę. Gdy jednak wierszy jest sporo, zaczyna...
- Dobre praktyki / CSS Zorientowane Obiektowo
...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: autorze - np. z jego imieniem, nazwiskiem i zdjęciem źródle - nazwa, logo i odnośnik Każdy z tych elementów można...
- HTML5 / Filmy i dźwięk <video, audio, source>
...wyśrodkować film w HTML? Aby ustawić odtwarzacz wideo na środku ekranu, należy go umieścić wewnątrz elementu blokowego z przypisanym odpowiednim stylem: <div style="text-align: center"> <video src="film.mp4"></video> </div>.