Thẻ <textarea> tạo ô nhập liệu nhiều dòng trong form, chứa số ký tự không giới hạn.
Khi cần nhập văn bản dài (phản hồi, mô tả lỗi...), <textarea> là lựa chọn lý tưởng. Hướng dẫn này trình bày cú pháp, ví dụ và bảng thuộc tính.
Thẻ <textarea>
Cú pháp cơ bản:
<textarea rows="10" cols="10"> Nội dung mặc định </textarea>
Khác với <input>, <textarea> bắt buộc có thẻ đóng vì nội dung mặc định nằm giữa hai thẻ.
Thuộc tính chính:
rows: số hàng (chiều cao).cols: số cột (chiều rộng).
Ví dụ form phản hồi cửa hàng quần áo:
<form> <label for="feedback">Phản hồi của bạn:</label><br><br> <textarea rows="5" cols="30" id="feedback" name="feedback"> Ý kiến của bạn... </textarea> </form>
Ví Dụng Nâng Cao
Giới Hạn Độ Dài (minlength, maxlength)
Đặt tối thiểu 10 ký tự, tối đa 1000:
<textarea rows="5" cols="30" name="feedback" minlength="10" maxlength="1000"></textarea>
Lưu ý: minlength chỉ có hiệu lực khi có thuộc tính required.
Văn Bản Gợi Ý (placeholder)
Hiển thị gợi ý mờ, biến mất khi gõ:
<textarea placeholder="Nhập phản hồi ở đây..." rows="5" cols="30"></textarea>
Bảng Thuộc Tính Đặc Thù
| Thuộc Tính | Giá Trị | Mô Tả |
|---|---|---|
| autofocus | autofocus | Tự focus khi tải trang. |
| cols | số | Số cột hiển thị mặc định. |
| disabled | boolean | Vô hiệu hóa ô nhập. |
| form | form ID | Liên kết với form. |
| maxlength | số | Số ký tự tối đa. |
| minlength | số | Số ký tự tối thiểu. |
| name | tên | Tên trường (bắt buộc để submit). |
| placeholder | văn bản | Gợi ý mờ khi ô rỗng. |
| readonly | boolean | Chỉ đọc, không sửa. |
| required | boolean | Bắt buộc điền. |
| rows | số | Số hàng hiển thị mặc định. |
Kết Luận
<textarea> là công cụ mạnh để thu thập văn bản dài. Bài viết đã trình bày cú pháp, ví dụ thực tế và bảng tham khảo thuộc tính. Bạn đã sẵn sàng sử dụng textarea như chuyên gia HTML!