Placehodel: Trình dữ chỗ ( theo từ điển).
Thuộc placeholde tính chỉ định một gợi ý ngắn mô tả giá trị dự kiến của trường đầu vào (ví dụ: giá trị mẫu hoặc mô tả ngắn về định dạng dự kiến).
Gợi ý ngắn được hiển thị trong trường nhập liệu trước khi người dùng nhập giá trị.
1. Các sử dụng placeholder
Bước 1: Thêm thuộc tính placeholder trên thẻ input
Cú pháp:
<input placeholder="value">
Giá trị thuộc tính:
Value | Mô tả |
---|---|
Text | Chỉ định một gợi ý ngắn mô tả giá trị dự kiến của trường đầu vào |
Bước 2: Thêm trên CSS
::placeholder {
css declarations;
}
2 . Sự khác nhau giữa placeholder và data-placeholder
- Thuộc tính placeholder là một thuộc tính HTML5 tiêu chuẩn
- data-placeholder chỉ là data- thuộc tính HTML5 được sử dụng bởi một số plugin javascript. Data là dữ liệu chung được đính kèm với phần tử.
Hãy thử ví dụ dưới đây để rõ sự khác biệt:
=> Bộ ::placeholder chọn chọn các thành phần biểu mẫu có văn bản giữ chỗ và cho phép bạn tạo kiểu cho văn bản giữ chỗ.
Văn bản trình giữ chỗ được đặt với thuộc tính trình giữ chỗ, chỉ định một gợi ý mô tả giá trị dự kiến của trường nhập.
=> data-placeholder là dữ liệu Data là dữ liệu chung được đính kèm với phần tử. Không thể CSS cho nó.
Nguồn: viblo.asia