Menu
CoddyTech

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ủa for phải khớp với id củ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ính for trong 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.

challenge icon

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ính for được đặt thành 'firstname'.
  • Một trường <input> có type="text".
  • Trường <input> cần có id khớp với thuộc tính for của nhãn.

Tự làm thử

<!DOCTYPE html>
<html>
    <body>
        <form>
        <!-- Viết code ở đây -->
        
        </form>
    </body>
</html>
quiz iconTự kiểm tra

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

Tự luyện tập: Playground Web