: optional adalah selektor Pseudo-class CSS yang digunakan untuk memilih elemen form yang bersifat opsional.
Lebih khusus lagi, ini digunakan untuk memilih elemen formulir yang tidak diperlukan; yaitu, elemen formulir yang tidak memiliki set atribut yang diperlukan.
Elemen formulir yang dapat dipilih menggunakan: optional adalah <input> s, <select> s, dan <textarea> s tanpa atribut yang diperlukan.
Misalnya, elemen formulir berikut dapat dipilih menggunakan: optional:
1 2 3 4 5 6 7 8 9 10 11 |
<input type="text"> <input type="submit"> <!-- and other input types as well.. --> <textarea name="name" id="id" cols="30" rows="10"></textarea> <select name="nm" id="sel"> <!-- options --> </select> |
Elemen formulir berikut ini tidak dapat dipilih menggunakan: optional:
1 2 3 4 5 6 7 8 9 10 11 |
<input type="name" required> <input type="email" required> <!-- and other input types as well.. --> <textarea name="name" id="message" cols="30" rows="10" required></textarea> <select name="nm" id="sel" required> <!-- options --> </select> |
: optional berguna untuk menata elemen bentuk opsional dengan cara yang akan mengurangi fokus visual pada elemen tersebut dan lebih fokus pada bidang yang diperlukan.
Contoh:
Berikut ini akan memberikan gaya yang sedikit pudar pada input yang meminta pengguna untuk URL situs web. Ini biasanya merupakan bidang opsional dalam formulir komentar, misalnya.
1 2 3 4 |
input[type="url"]:optional { background-color: #f5f5f5; border: 1px solid #eee; } |