style html - Kurs HTML i CSS
Formularze HTML / Pole wyboru <input "checkbox">...użytkownik zaznaczy odpowiednią opcję wyboru: <input type="checkbox" name="nazwa" value="wartość" onclick="document.getElementById('identyfikator').style.display = this.checked ? 'block' : 'none'; this.form.elements['nazwa2'].disabled = this.form.elements['nazwa3'].disabled = !this.checked"> <div id="identyfikator" style="display: none"> <input type="text" name="nazwa2" disabled> <input type="text" name="nazwa3" disabled> </div> Przykład <input "checkbox" onclick> Po wybraniu tej opcji...
Selektory pseudoklas CSS / Odsyłacz podstawowy :link...jest selektorem odsyłacza [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Polecenie pozwala nadać określone atrybuty formatowania dla wszystkich podstawowych odsyłaczy na stronie czyli takich, które nie zostały jeszcze odwiedzone przez użytkownika. Ponieważ pseudoklasa :link odnosi się tylko do odsyłaczy, w regule stylu można pominąć selektor elementu a: :link { cecha...
- Rozmiary CSS / Wysokość {height}
...<body>, a także upewnić się, że żadne z tych elementów nie ma ustawionej marginesów ani paddingu, które mogą wpłynąć na wysokość. Na przykład: <html style="height: 100%"> <body style="height: 100%; margin: 0"> <div style="height: 100%">Ten DIV zajmie całą dostępną wysokość.</div> </body> </html>.
- Tryb Quirks / X-UA-Compatible
...jeśli wstawimy przycisk bez tego atrybutu, będzie on wysyłał formularz CSS Przy deklarowaniu alternatywnych arkuszy stylów zapis rel="alternate stylesheet" jest równoważny rel="stylesheet alternate". Własność display - uzupełniona obsługa wartości: table, inline-table, table-row, table-row-group, table-column, table-column-group, table-cell, table-caption, run-in, ruby, ruby-base, ruby-text, ruby-base-container, ruby-text-container Własność border-style - uzupełniona obsługa wartości...
- HTML5 / Wstępne ładowanie <link "preload" as>
...następujące wartości: w języku HTML - audio, document (dokument HTML), embed, frame, iframe, image, object, track, video w języku CSS - font, style (zewnętrzny arkusz stylów oraz import arkusza stylów) w języku JavaScript - fetch, json, script w języku XML - xslt (ang. Extensible Stylesheet Language Transformations) typ Odpowiedni typ MIME lokalizacja Ścieżka dostępu albo adres URL wskazujące na miejsce, skąd ma zostać załadowany zewnętrzny zasób Domyślnie przeglądarki...
- HTML dla zielonych / Łączenie znaczników i atrybutów HTML <p "text-align", span "font-size, color", b, i, u>
...akapit, wielkość czcionki, kolor czcionki, pogrubienie, pochylenie, przekreślenie) dotyczące tekstu można łączyć, np. po wpisaniu w edytorze: <p style="text-align: center"><span style="font-size: large; color: red"><b><i><u> To jest jakiś tekst </u></i></b></span></p> otrzymamy: To jest jakiś tekst Zauważ, że znaczniki zamykamy w kolejności odwrotnej jak je otwieraliśmy. Czyli najpierw zamykamy znacznik, który został otwarty jako ostatni (w naszym przykładzie jest to: <u>), a na końcu...
- HTML dla zielonych / Jak zrobić dobrą stronę HTML
...koniecznie podporządkować się takiemu kanonowi, lecz jeżeli chcesz uzyskać podobną strukturę, we właściwej treści strony (BODY) wpisz np.: <header style="text-align: center">Tutaj można umieścić logo serwisu</header> <nav style="width: 300px; float: left; overflow: hidden"> Tu umieszcza się odsyłacze spisu treści </nav> <article style="margin-left: 320px"> Tu wpisuje się treść strony </article> <footer style="text-align: center; clear: both">Tutaj można umieścić stopkę serwisu</footer> a...
- Wstawianie stylów CSS / Import arkusza stylów @import
<style> @import url(adres zewnętrznego arkusza stylów); </style> Polecenie można wstawić zarówno w wewnętrznym jak i zewnętrznym arkuszu stylów. Pozwala wczytać zewnętrzny arkusz stylów, przy czym może się on znajdować na tym samym serwerze (wtedy można podać względną ścieżkę dostępu) lub w dowolnym miejscu w obrębie całego Internetu (wtedy podajemy adres internetowy). Po wczytaniu, zostanie on automatycznie dołączony do strony. Oprócz importu arkusza, możesz umieścić pomiędzy znacznikami...
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...
- Tabele HTML / Struktura tabeli HTML <table, tr, td>
...nie zostanie rozciągnięta, ale ustawi się po lewej stronie ekranu. Aby wyśrodkować taką wąską tabelę, można się posłużyć następującym kodem: <table style="margin: auto">...</table>.