kontrolki - Kurs HTML i CSS
HTML5 / Walidacja pól formularza <input pattern>...to nie tylko prawidłowo zweryfikować poprawność wprowadzanych danych, ale również w wielu przypadkach udostępni użytkownikowi specjalną wersję kontrolki ułatwiającej wybór wartości. Ponadto urządzenia mobilne (np. smartfony) mogą wtedy przełączyć klawiaturę ekranową we właściwy tryb zawierający odpowiedni zestaw klawiszy. Przykład <input pattern> Kod pocztowy musi się rozpoczynać dwiema cyframi, następnie zawierać myślnik i na końcu trzy cyfry (np.: 12-345): <input name="kod_pocztowy...
Selektory atrybutów CSS / Selektor atrybutu o określonej wartości...(nie powinien być czerwony). Inne przydatne zastosowanie tego selektora to np. zmiana sposobu formatowania elementów formularzy. Niemal wszystkie kontrolki formularza są tworzone przy użyciu znacznika <input type="...">. O tym jaki rodzaj pola zobaczymy na ekranie, decyduje atrybut type="...". Jeśli chcielibyśmy zmienić rodzaj obramowania dla wszytkich pól tekstowych (type="text"), tak aby nie wpłynęło to na pola innego typu (np. na przycisk wysłania formularza - type="submit"), należałoby...
- Selektory pseudoklas CSS / Domyślne :default
...<div> <button type="submit">Wyślij</button> <button type="reset">Wyczyść</button> </div> </form> otrzymamy formularz, w którym domyślne kontrolki mają dodatkowy margines z lewej strony: Opcja 1 Opcja 2 Opcja 3 Wyślij Wyczyść
- Selektory pseudoklas CSS / Tylko do odczytu :read-only :read-write
...<input type="text" value="Tylko do odczytu" readonly> <input type="text" value="Do odczytu i do zapisu"> </form> otrzymamy dwie tekstowe kontrolki formularza - pierwsza z niebieskim obramowaniem (zablokowana), a druga z czerwonym (odblokowana):