Định nghĩa và sử dụng
- Tag được sử dụng cho người dùng nhập hay chọn thông tin.
- Dạng của có thể có nhiều dạng khác nhau, tùy thuộc vào thuộc tính tùy trọn type, có thể là text, một checkbox, một trường password, một button radio, một button, ...
- Khuyên: sử dụng tag để tạo nhãn cho các thành phần
Sự khác nhau giữa HTML và XHTML
Không cần kết thúc tag | Cần khoảng trắng và ký tự "/" để kết thúc tag |
Cấu trúc
Tag phải được viết bên trong một tag
Ví dụ
Xem thêm ví dụ
Html viết:
- Họ tên:
- Email:
- Ngày sinh:
Hiển thị trình duyệt:
- Họ tên:
- Email:
- Ngày sinh:
Các loại [type]
Input dạng text:
Sử dụng để nhập giá trị text.
Xem thêm ví dụ
Input dạng password:
Text hiển thị bên trong dưới dạng password.
Xem thêm ví dụ
Input dạng hidden:
Dạng này sẽ không hiển thì ra trình duyệt.
Được sử dụng khi không muốn dữ liệu bị thay đổi.
Input dạng checkbox:
Được sử dụng cho nhiều lựa chọn khác nhau.
Xem thêm ví dụ
Input dạng radio:
Được sử dụng cho một chọn lựa duy nhất.
Các phải cùng "name", nếu không sẽ không chọn được.
Xem thêm ví dụ
Input dạng button:
Sử dụng như một nút nhấn.
Input dạng button reset:
Dùng để reset lại giá trị trong .
Input dạng image:
Sử dụng như một nút nhấn bằng hình.
Input dạng file upload:
Sử dụng để upload file.
Trình duyệt hỗ trợ
được hỗ trợ trong đa số các trình duyệt.
Thuộc tính
Cách sử dụng:
Thuộc tính tùy chọn
accept | kiểu MIME | accept="image/gif" | Xác định loại tập tin có thể được gửi thông qua một tập tin tải lên [upload] [sử dụng đối với type="file"]. Không được hỗ trợ trong phần lớn các trình duyệt. |
align | left right top middle bottom |
align="left" | Được dùng để sắp xếp vị trí cho image của [sử dụng đối với type="image"]. Không khuyến khích sử dụng, sử dụng thuộc tính text-align của css để thay thế. Không được hỗ trợ trong DTD Strict |
alt | Text | alt="Đây là alt" | Xác định alt cho image của [chỉ cho type="image"] |
checked | checked | checked="checked" | Xác định một thành phần được chọn trước khi tải trang [sử dụng đối với type="checkbox" hay type="radio"] |
disabled | disabled | disabled="disabled" | Xác định một thành phần không hiển thị trước khi tải trang. |
maxlength | Số | maxlength="50" | Xác định số ký tự nhiều nhất được phép nhập của một trường [sử dụng đối với type="text" hay type="password"] |
name | name | name="inputName" | Xác định tên cho thành phần . |
readonly | readonly | readonly="readonly" | Xác định rằng trường chỉ được đọc [sử dụng đối với type="text" hay type="password"] |
size | Số | size="30" | Xác định chiều rộng của một trường . |
src | URL | src="img/ btn_name.gif" | Hiển thị đường dẫn của hình, hiển thị như một button submit. |
type | button | type="button" | Xác định loại hiển thị dạng nút nhấn. |
checkbox | type="checkbox" | Xác định loại hiển thị dạng hộp kiểm. | |
file | type="file" | Xác định loại hiển thị dạng chọn file. | |
hidden | type="hidden" | Xác định loại hiển thị dạng ẩn. | |
image | type="image" | Xác định loại hiển thị dạng hình. | |
password | type="password" | Xác định loại hiển thị dạng password. | |
radio | type="radio" | Xác định loại hiển thị dạng chọn lựa. | |
reset | type="reset" | Xác định loại hiển thị dạng phục hồi. | |
submit | type="submit" | Xác định loại hiển thị dạng submit. | |
text | type="text" | Xác định loại hiển thị dạng text.. | |
value | Giá trị | value="Gửi" | Xác định giá trị của . |
Thuộc tính tổng quát [xem thêm]
accesskey | Ký tự | accesskey="g" | Xác định một phím tắc để truy cập vào một thành phần. |
class | Tên class | class="section" | Tên class |
dir | rtl ltr |
dir="rtl" | Xác định hướng văn bản cho các nội dung trong một thành phần. |
id | Tên id | id="layout" | Xác định tên id cho thành phần, mỗi thành phần chỉ có một id duy nhất [hoặc một id chỉ có trong một thành phần] trong một văn bản HTML |
lang | Mã ngôn ngữ | lang="vi" | Xác định mã ngôn ngữ cho nội dung trong một thành phần. |
style | Kiểu định dạng | style="color: red" | Xác định một định dạng cho một thành phần. |
tabindex | Số | tabindex="5" | Xác định thứ tự tab của một thành phần. |
title | Text | title="Đây là title" | Xác định thêm thông tin cho thành phần. |
xml:lang | Mã ngôn ngữ | lang="vi" | Xác định mã ngôn ngữ cho nội dung trong một thành phần, trong văn bản XHTML. |
Thuộc tính sự kiện
Không được hỗ trợ trong DTD Strict
title | Code script | title="code" | Script chạy khi click chuột. |
ondblclick | Code script | ondblclick="code" | Script chạy khi double click chuột. |
onmousedown | Code script | onmousedown="code" | Script chạy khi button chuột được nhấn. |
onmousemove | Code script | onmousemove="code" | Script chạy khi di chuyển con trỏ chuột. |
onmouseout | Code script | onmouseout="code" | Script chạy khi di chuyển con trỏ chuột ra khỏi thành phần. |
onmouseover | Code script | onmouseover="code" | Script chạy khi di chuyển con trỏ chuột di chuyển trên thành phần. |
onmouseup | Code script | onmouseup="code" | Script chạy khi button chuột được thả ra. |
onkeydown | Code script | onkeydown="code" | Script chạy khi nút trên bàn phím được nhấn. |
onkeypress | Code script | onkeypress="code" | Script chạy khi nút trên bàn phím được nhấn và thả ra. |
onkeyup | Code script | onkeyup="code" | Script chạy khi nút trên bàn phím được thả ra. |
Link liên quan
Tag trước
Tag kế tiếp