![How to Design Accessible Forms with HTML and CSS](https://img.php.cn/upload/article/000/000/000/173615974462654.jpg)
Jadual Kandungan
- Pengenalan
- Komponen bentuk
- Borang Boleh Dicapai dengan HTML
- Kesimpulan
pengenalan
Borang adalah bahagian penting dalam membina tapak web. Ia digunakan untuk mengumpul data daripada pengguna apabila mereka menyerahkan butiran mereka. Borang adalah penting dalam interaksi pengguna menghantar borang pendaftaran mereka, log masuk dalam borang, melanggan surat berita atau menghantar mesej untuk menerima maklum balas. Mencipta borang yang boleh diakses adalah penting kepada semua orang terutamanya pembaca skrin untuk mengisi borang tanpa sebarang masalah.
Komponen sesuatu borang
Sesuatu borang terdiri daripada komponen yang berbeza seperti
-
borang: ini ialah bekas yang menerima semua elemen borang lain seperti teg input, butang hantar, kawasan teks, kotak pilihan dan butang radio
<form></form>
Salin selepas log masuk
-
input: ini ialah elemen HTML yang menerima butiran pengguna. Teg input dihidangkan bergantung pada tujuan input; teks, nombor, kata laluan, e-mel antara lain
<form>
<input type="text" />
<input type="email" />
<input type="password" />
<input type="radio" />
<input type="checkbox" />
<input type="file" />
<input type="range" />
<input type="color" />
<input type="date"/>
</form>
Salin selepas log masuk
-
label: tag ini yang memberikan garis besar butiran untuk mengisi input. Ia dikaitkan dengan teg input.
<form>
<label for="email">Email</label>
<input type="email">
Salin selepas log masuk
-
textarea: this is an multi-line input tag that accept 524,288 characters by default except the maxlength attribute is set up to a value. It is used to accept reviews, messages and comments from the users
<form>
<label for="message">Message:</label>
<textarea>
Salin selepas log masuk
-
select: this element is for creating a dropdown in which the users are able to select one option by default or more options when the attribute multiple is being used.
<form>
<select>
Salin selepas log masuk
-
checkbox: this element allow users to select one or more options.
<form>
<label for="subscribe"></label>
<input type="checkbox">
Salin selepas log masuk
-
button: this tag will the users the opportunity to submit their details upon completion. These details are submitted to server.
<form>
<button type="submit">Submit</button>
</form>
Salin selepas log masuk
Borang yang boleh diakses dengan HTML
Menggunakan teg sematik yang betul seperti