Nhãn cho ô nhập
Thuộc phần Kiến thức cơ bản trong hành trình HTML của Coddy. Bài học 39 trên 60.
Không phải lúc nào bạn cũng dễ biết một ô nhập liệu dùng để làm gì nếu không có nhãn. Nhãn giúp người dùng nhận biết trực quan loại dữ liệu cần nhập vào ô đó. Bạn tạo nhãn bằng thẻ <label>.
Đây là cú pháp (syntax) cơ bản:
<label for="field">Label text</label>
<input type="text" id="field"><label>: Thẻ tạo nhãn.
for: Liên kết nhãn với trường biểu mẫu. Giá trị củaforphải khớp vớiidcủa trường biểu mẫu.
- Nhãn: Văn bản mô tả mục đích của trường trong biểu mẫu.
<input>: Trường biểu mẫu mà nhãn này đề cập đến.
id: Mã định danh duy nhất của trường biểu mẫu, khớp với thuộc tínhfortrong nhãn.
Sau khi được liên kết, khi nhấp vào văn bản nhãn, con trỏ sẽ chuyển đến trường đầu vào (trường này sẽ được lấy tiêu điểm), giúp người dùng có vùng nhấp lớn hơn.
Thử thách
DễThêm các thẻ sau vào bên trong thẻ <form>:
- Một thẻ
<label>có văn bản 'First Name:' và thuộc tínhforđược đặt thành 'firstname'. - Một trường
<input>cótype="text". - Trường
<input>cần cóidkhớp với thuộc tínhforcủa nhãn.
Tự làm thử
<!DOCTYPE html>
<html>
<body>
<form>
<!-- Viết code ở đây -->
</form>
</body>
</html>Bài học này có một bài trắc nghiệm ngắn. Bắt đầu bài học để trả lời và theo dõi tiến độ.
Tất cả bài học trong Kiến thức cơ bản
1Kiến thức cơ bản về HTML
HTML là gì?Cấu trúc cơ bản của HTMLThẻ và phần tửThẻ lồng nhau và thẻ đóngChú thích trong HTML2Văn bản và định dạng
Tiêu đềĐoạn vănNgắt dòngChữ đậm và chữ nghiêngLại chữ đậm và chữ nghiêngÔn tập: định dạng8Biểu mẫu và đầu vào phần 1
Kiến thức cơ bản về biểu mẫuÔ nhập văn bảnThuộc tính của ô nhậpTrường mật khẩuNhãn cho ô nhậpÔn tập: biểu mẫu cơ bản11Trang đăng ký sự kiện
Tổng quan dự ánPhần đầu trang3Làm việc với danh sách
Danh sách không có thứ tựDanh sách có thứ tựDanh sách lồng nhauÔn tập: danh sách9Biểu mẫu và đầu vào phần 2
Nút radioHộp kiểmDanh sách thả xuốngNútNút trong biểu mẫuÔn tập: biểu mẫu #1Ôn tập: biểu mẫu #2Tự luyện tập: Playground Web