formularzy - Kurs HTML i CSS
HTML5 / Autouzupełnianie <datalist>...<option value="wartość1"> <option value="wartość2"> ... </datalist> Większość przeglądarek posiada funkcję tzw. autouzupełniania elementów formularzy. Jeżeli użytkownik wpisze coś w formularzu, a potem go wyśle, to kiedy będzie następnym razem wypełniał ten sam formularz, przeglądarka wyświetli mu podpowiedzi w postaci wartości, które wcześniej wpisywał w wybranych polach. Taki mechanizm jest bardzo wygodny, ponieważ pozwala zaoszczędzić użytkownikowi sporo czasu na wprowadzaniu...
- HTML5 / Główna treść <main>
...żadnych stałych elementów, które powtarzają się w całym serwisie: menu nawigacyjnego, informacji o prawach autorskich, logo serwisu, bannerów, formularzy wyszukiwania itp. Znacznik ten może jednak obejmować linki nawigujące do podsekcji głównej zawartości dokumentu, które nie powtarzają się na innych stronach. W pojedynczym dokumencie nie można umieścić więcej niż jednego elementu MAIN, chyba że zawiera atrybut hidden. Element MAIN nie może być również umieszczony - bezpośrednio lub...
Tekst CSS / Tryb pisania {writing-mode}...(poziomo): To jest pierwsza linijka... ...a to jest kolejna linijka. Ponadto niektóre przeglądarki mogą układać pionowo również tekstowe elementy formularzy: To jest pierwsza linijka... obszar tekstowy lista rozwijalna opcja 1 opcja 2 lista rozwijalna opcja 1 opcja 2 ...a to jest kolejna linijka. Jeśli powyżej widzisz pola formularza ułożone poziomo, to znaczy, że Twoja przeglądarka nie obsługuje pionowego ich ułożenia.
- HTML5 / Wyszukiwarka <search>
...formularz. Do stworzenia wyszukiwarki można się posłużyć językiem takim jak PHP (wyszukiwarka), JavaScript (filtrowanie) albo skorzystać z gotowych formularzy wyszukiwarek internetowych. Przykład <search> <search> <form action="search.php"> <input type="search" name="q"> <button type="submit">Szukaj</button> </form> </search>
- Tekst CSS / Orientacja tekstu {text-orientation}
...Wiersz 2 4 5 6 Wiersz 3 7 8 9 [Porównaj przykład z rozdziału: Tryb pisania] Niektóre przeglądarki mogą układać pionowo również tekstowe elementy formularzy: To jest pierwsza linijka... obszar tekstowy lista rozwijalna opcja 1 opcja 2 lista rozwijalna opcja 1 opcja 2 ...a to jest kolejna linijka. Jeśli powyżej widzisz pola formularza ułożone poziomo, to znaczy, że Twoja przeglądarka nie obsługuje pionowego ich ułożenia.
- HTML5 / Element bierny <... inert>
...być interaktywny - tzn.: Użytkownik nie będzie w stanie zaznaczyć tekstu takiego elementu. Nie będzie możliwości edytowania zawartości w polach formularzy ani elementach z atrybutem contenteditable="true". Zawartość, tak oznaczonego elementu, jest ignorowana podczas przeszukiwania dokumentu (skrót klawiaturowy Ctrl+F). Do skryptów JavaScript nie docierają z niego zdarzenia "click" ani "focus". Element i cała jego zawartość mogą być zignorowane przez technologie zwiększające dostępność...
- HTML5 / Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>
...adres URL week - tydzień w roku [Zobacz również: Formularze] Znany ze specyfikacji HTML 4.01 element INPUT, tworzy większość rodzajów kontrolek formularzy. O tym, jaki typ elementu zostanie wyświetlony na ekranie, decyduje wartość atrybutu type="...". W języku HTML5 wprowadzono wiele dodatkowych typów kontrolek dla znacznika INPUT. W przypadku kiedy przeglądarka nie będzie obsługiwać nowych typów kontrolek, na ekranie zostanie wyświetlone zwykłe pole tekstowe (<input type="text">). Co...
- HTML5 / Przeciągnij i upuść <... draggable>
...użytkowników. Jeśli taki link zostanie upuszczony na pasku adresu przeglądarki, nastąpi jego wczytanie. Można je również upuszczać na pola tekstowe formularzy. W niektórych przypadkach możemy jednak nie chcieć takiego zachowania. Aby zablokować przypadkowe przeciągnięcie elementu przez użytkownika wystarczy nadać mu atrybut draggable="false". Oprócz tego do sterowania mechanizmem przeciągnij-i-upuść służą zdarzenia: ondragstart - zapoczątkowanie operacji przeciągania ondrag - kontynuacja...