Hướng dẫn cách làm việc của From trong HTML CSS
Hướng dẫn cách làm việc của From trong HTML CSS:
Dưới đây dohoalaptrinh.com xin cung cấp một số tài liệu về html css cách tạo form đăng ký đăng nhập bằng html css các bạn nếu như thấy thích thú thì cùng nhau tham khảo nha. Bắt đầu với việc tạo website tĩnh bằng ngôn ngữ lập trình web html và css đặc biệt khi tạo trang web động bằng PHP hay drupal… thì việc sử dụng form lại vô cùng quan trọng cần thiết. Form nhập liệụ sử dụng thường xuyên như chuyển dữ liệu từ người dung nhập đến sever, tạo form đăng nhập…. Chúng ta cùng tìm hiểu để xây dựng form nhập liệu bằng html hay sử dụng.
Trong HTML <form> là yếu tố xác định một hình thức được sử dụng để thu thập đầu vào cho người sử dụng:
<form>
Đây là form
</form>
Yếu tố hình thức có nhiều loại khác nhau : các yếu tố đầu vào, về văn bản, kiểm tra , các nút radio, button ..
Các thuộc tính trong thẻ <form>:
. action: đường dẫn đến 1 trang xử lý dữ liệu sau khi người dung ấn nút gửi dữ liệu
. method: Phương thức gửi dữ liệu
. name : tên form
Các thuộc tính trên thuộc về bên sử lý của server nên nếu bạn chỉ học về html thì không để ý lắm xong cần nhớ khi tạo form cần các thuộc tính đó
<input> phần tử
Các phần tử <input> là các yếu tố hình thức quan trọng nhất.
<Input> phần tử có thể được hiển thị bằng nhiều cách tùy thuộc vào các loại thuộc tính mình sử dụng
Ví dụ:
| Kiểu | Miêu tả |
| <Input type =”text” | Định nghĩa lĩnh vực đầu vào là văn bản |
| <Input type = “radio” | Định nghĩa nút radio (có nhiều lựa chọn nhưng chỉ được chọn 1) |
| <Input type =”button” | Định nghĩa việc thực thi hành động gửi như tìm kiếm, sửa , xóa… |
1.Text Input
<input type=”text”> dùng định nghĩa đầu vào là 1 dòng cho văn bản
VD
<form action=“”>
Tên đăng nhập <br>
<input type=“text” name=“tendangnhap”/><br>
Mật khẩu <br>
<input type=“text” name=“matkhau”/><br>
</form>
Kết quả:
Tên đăng nhập:
Mật khẩu:
2.Radio Button Input
<input type=”radio”> định nghĩa cho nút radio nút chọn
Nút radio chỉ được chọn 1 trong nhiều trường hợp đưa ra
Ví dụ:
<form action=“”> <input type=“radio” name=“Hoclt” value=“hoclaptrinh”/> Học lập trình <br> <input type=“radio” name=“Hocpts” value=“hocphotoshop”/> Học photoshop <br> <input type=“radio” name=“Hoctest” value=“hoctest”/> Học tester <br> </form>
Kết quả
3.Submit button
<input type =”submit”> định nghĩa nút gửi dữ liệu như một hình thức xử lý
Các hình thức này quy định trong các hình thức hành động thuộc tính:
Ví dụ
<form action=“”> Tên đăng nhập <br> <input type=“text” name=“tendangnhap”/><br> Mật khẩu <br> <input type=“text” name=“matkhau”/><br> <input type=“submit” name=“submit” value=“Đăng nhập”/> </form>
Kết quả:
4.Check box
<input type=”checkbox”> định nghĩa chọn nhiều phần tử từ danh sách đưa ra
Ví dụ:
<form action=“”> Bạn thích gì? <br> <input type=“checkbox” name=“chon” value=“chon1”/> Xem phim<br> <input type=“checkbox” name=“chon” value=“chon2”/> Đi mua sắm<br> <input type=“checkbox” name=“chon” value=“chon2”/> Ngủ nướng<br> <input type=“checkbox” name=“chon” value=“chon4”/> Tập thể thao<br> </form>
Kết quả:
-
File upload
<input type=”file”> định nghĩa hình thức chọn file trên ngay máy tính của bạn muốn tải lên trang web của mình làm
Ví dụ:
<form action=“”> Chọn file bạn muốn upload? <br> <input type=“file” name=“chon” value=“chon4”/> <br> </form>
Kết quả:
Kết luận: Các thuộc tính của form
| Action | Chỉ định một địa chỉ (URL) nơi để gửi |
| Autocomplete | Chỉ định nếu trình duyệt tự điền biểu mẫu(mặc định:trên) |
| Method | Chỉ định phương pháp HTTP được sử dụng khi nộp mẫu đơn(mặc định : GET) |
| Name | Chỉ định một tên được sử dụng để xác định |
| Value | Giá trị dữ liệu ban đầu để gửi các thành phần form các thành phần không có value thuộc tính ban đầu sẽ là null |
tag: học thiết kế đồ họa tại hà nội, học thiết kế đồ họa ở hà nội, học thiết kế đồ họa ở đâu, học thiết kế đồ họa ngắn hạn, khóa học thiết kế đồ họa tại hà nội, lớp học thiết kế đồ họa ở hà nội, học thiết kế đồ họa ở đâu tốt, lớp học thiết kế đồ họa ngắn hạn ở hà nội.
>>>> bạn có thể quan tâm đến bài viết khác:
- Khóa học lập trình wordpress
- Khóa học html css bootstrap
- Khóa học thiết kế đồ họa in ấn
- Học photoshop tại hà nội
- Khóa học lập trình php tại hà nội
Bình luận