Định nghĩa và cách sử dụng
Thuộc tính
controls là một thuộc tính boolean.
Khi có mặt, nó chỉ định rằng các điều khiển âm thanh/video sẽ được hiển thị.
Điều khiển nên bao gồm:
- Chơi
- Tạm ngừng
- Tìm kiếm
- Âm lượng
- Chuyển đổi toàn màn hình [chỉ dành cho video]
- Chú thích/phụ đề [chỉ dành cho video, khi có sẵn]
- Theo dõi [chỉ dành cho video, khi có sẵn]
Áp dụng cho
Thuộc tính
controls có thể được sử dụng trên các yếu tố sau:
| kiểm soát | |
| kiểm soát |
Ví dụ
Ví dụ âm thanh
Một phần tử có điều khiển mặc định trình duyệt:
& nbsp; & nbsp; & nbsp; Trình duyệt của bạn không hỗ trợ các yếu tố âm thanh.
Your browser does not support the audio element.
Hãy tự mình thử »
Ví dụ video
Một phần tử có điều khiển mặc định trình duyệt:
& nbsp; & nbsp; & nbsp; Trình duyệt của bạn không hỗ trợ thẻ video.
Your browser does not support the video tag.
Hãy tự mình thử »
Ví dụ video
Một phần tử có điều khiển mặc định trình duyệt:
| Hỗ trợ trình duyệt | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Thuộc tính controls có hỗ trợ trình duyệt sau cho từng phần tử: | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Thuộc tính HTML Controls là thuộc tính Boolean và chỉ định rằng các điều khiển âm thanh/video phải được hiển thị. Nó là mới trong HTML5.controls attribute is a boolean attribute and specifies that the audio/video controls must be displayed. It is new in HTML5.
Bạn có thể sử dụng thuộc tính điều khiển trên các yếu tố sau: và.controls attribute on the following elements: and .
Đối với thẻ, thuộc tính điều khiển bao gồm:controls attribute includes:
- Chơi
- Tạm ngừng
- Tìm kiếm
- Âm lượng
Đối với thẻ, thuộc tính điều khiển bao gồm:controls attribute includes:
- Chơi
- Tạm ngừng
- Tìm kiếm
- Âm lượng
- Chuyển đổi toàn màn hình
- Chú thích/phụ đề
- Theo dõi
Cú pháp
Ví dụ về thuộc tính điều khiển HTML được sử dụng trên phần tử:controls attribute used on the element:
Title of the document
Your browser does not support the audio element.
Click the play button
Ví dụ về thuộc tính điều khiển HTML được sử dụng trên phần tử:controls attribute used on the element:
Title of the document
video {
width: 300px;
height: 220px;
border: 1px solid #666;
}
Some information about video
Các biểu mẫu HTML là một phần không thể thiếu của trang web. Mục đích cơ bản của biểu mẫu là thu thập thông tin. Biểu mẫu được tạo bằng thẻ. Thẻ là thùng chứa cho tất cả các điều khiển đầu vào của biểu mẫu như nhãn, & NBSP; đầu vào văn bản, TextArea, hộp kiểm, nút radio, chọn menu/ danh sách thả xuống, hộp danh sách và nút. Thẻ và tất cả các thẻ điều khiển đầu vào khác phải có tên thuộc tính, sao cho dữ liệu được thu thập thông qua các biểu mẫu có thể được truy xuất.
Thẻ có một số thuộc tính:
- Tên - Được sử dụng để chỉ định tên của biểu mẫu
- Hành động - Được sử dụng để chỉ định vị trí mà dữ liệu biểu mẫu phải được gửi đến quy trình
- Phương thức - Được sử dụng để chỉ định phương thức mà dữ liệu được gửi. Các giá trị cho thuộc tính phương thức được nhận và đăng
- Nhận - Gửi dữ liệu đến máy chủ được gắn vào cuối URL
- Đăng - Gửi dữ liệu đến máy chủ trong thân thông báo
- Enctype & nbsp; - Thuộc tính này chỉ có thể được sử dụng với phương thức POST. Thuộc tính này được sử dụng để gửi một lượng lớn dữ liệu như tệp đính kèm hoặc để tải lên hình ảnh hoặc tệp PDF.
Mã HTML được đưa ra dưới đây mô tả việc sử dụng thẻ với tất cả các thuộc tính có thể:
[HTML] HTML Forms Đây là mô tả của thẻ biểu mẫu
HTML Forms
This is the description of form tag
Enctype & nbsp; - Thuộc tính này chỉ có thể được sử dụng với phương thức POST. Thuộc tính này được sử dụng để gửi một lượng lớn dữ liệu như tệp đính kèm hoặc để tải lên hình ảnh hoặc tệp PDF.
Enctype & nbsp; - Thuộc tính này chỉ có thể được sử dụng với phương thức POST. Thuộc tính này được sử dụng để gửi một lượng lớn dữ liệu như tệp đính kèm hoặc để tải lên hình ảnh hoặc tệp PDF.
[/HTML]
[/html]
Video dưới đây cho thấy hoạt động hoàn toàn của thẻ HTML Form và thẻ điều khiển đầu vào
Video: Thẻ HTML Form và thẻ điều khiển đầu vào
Thẻ có giá trị của thuộc tính loại là văn bản trực tuyến được sử dụng để tạo các điều khiển đầu vào văn bản. Ngoài tên là thuộc tính, có một số thuộc tính tùy chọn có thể được sử dụng với & nbsp; nhãn:
- Kích thước - Được sử dụng để chỉ định độ dài của điều khiển đầu vào văn bản tính bằng các ký tự
- Maxlength - Được sử dụng để chỉ định số lượng ký tự tối đa có thể được nhập bởi người dùng
- Giá trị - Được sử dụng để chỉ định văn bản mặc định từ điều khiển đầu vào
Mã HTML được đưa ra dưới đây cho thấy việc sử dụng thẻ với thuộc tính loại là văn bản trên mạng để tạo các điều khiển văn bản:
.
HTML Forms
Demonstrates creating Textfield Input Control for Web Page Form
Name:
Name:
Date of Birth:
[/html]
Đầu ra của mã HTML để tạo TextField được hiển thị bên dưới:
Kiểm soát đầu vào mật khẩu
Thẻ có giá trị của thuộc tính loại là mật khẩu mật khẩu được sử dụng để tạo các điều khiển đầu vào mật khẩu. Điều khiển đầu vào này cũng hỗ trợ tên, kích thước, maxlength và giá trị là thuộc tính tùy chọn. Mã HTML được đưa ra dưới đây cho thấy việc sử dụng thẻ với thuộc tính loại là mật khẩu mật khẩu để tạo mật khẩu & NBSP; Controls:
.
HTML Forms
Demonstrates creating Password Input Control for Web Page Form
Password:
Password:
[/html]
Đầu ra của mã HTML để tạo trường Mật khẩu & NBSP; được hiển thị bên dưới:
Hộp kiểm
Các hộp kiểm là các điều khiển đầu vào được sử dụng để chọn một tùy chọn duy nhất từ danh sách các tùy chọn. & NBSP; Thẻ có giá trị của thuộc tính loại là hộp kiểm tra hộp được sử dụng để tạo hộp kiểm. Điều khiển đầu vào này cũng hỗ trợ tên, giá trị và được kiểm tra dưới dạng các thuộc tính tùy chọn. Mã HTML được đưa ra bên dưới & nbsp; thể hiện việc sử dụng thẻ với thuộc tính loại dưới dạng hộp kiểm, hộp kiểm để tạo các điều khiển hộp kiểm:
.
HTML Forms
Demonstrates creating Checkbox Input Control for Web Page Form
List of Countries
United States of America
Germany
India
United Kingdom
List of Countries with prechecked value
United States of America
Germany
India
United Kingdom
[/html]
Đầu ra của mã HTML để tạo các hộp kiểm được hiển thị bên dưới:
Nút radio
Các nút radio là các điều khiển đầu vào được sử dụng để chọn nhiều tùy chọn từ danh sách các tùy chọn. & NBSP; TAG có giá trị của thuộc tính loại là radio radio được sử dụng để tạo các nút radio. Điều khiển đầu vào này cũng hỗ trợ tên, giá trị và được kiểm tra dưới dạng các thuộc tính tùy chọn.
.
HTML Forms
Demonstrates creating Radio Button Input Control for Web Page Form
List of Countries
United States of America
Germany
India
United Kingdom
List of Countries prechecked value
United States of America
Germany
India
United Kingdom
[/html]
Đầu ra của mã HTML để tạo các nút radio được hiển thị bên dưới:
Chọn menu
Các menu chọn hoặc hộp thả xuống là các điều khiển đầu vào được sử dụng để chọn một tùy chọn duy nhất từ danh sách lớn các tùy chọn. & NBSP; Thẻ được sử dụng để tạo các menu chọn. Thẻ này hỗ trợ tên như một thuộc tính. Tùy chọn được chọn được liệt kê với thẻ có giá trị làm thuộc tính. Thẻ này cũng đã chọn là một thuộc tính tùy chọn. Mã HTML được đưa ra bên dưới & nbsp; thể hiện việc sử dụng thẻ với thẻ để tạo các điều khiển chọn hoặc thả xuống:
.
HTML
Forms
Demonstrates creating Select Menu Input Control for Web Page Form
List of Countries
United States of America
Germany
India
United Kingdom
List of Countries with preselected value
United States of America
Germany
India
United Kingdom
[/html]
Đầu ra của mã HTML để tạo Chọn, Dropdown và Menu được hiển thị bên dưới:
LISTBOX
Điều khiển đầu vào ListBox giống như các menu chọn ngoại trừ chúng được sử dụng để chọn nhiều tùy chọn từ danh sách các tùy chọn khổng lồ. Thẻ này hỗ trợ tên như một thuộc tính. Tùy chọn được chọn được liệt kê với thẻ có giá trị làm thuộc tính. Thẻ này cũng đã chọn và kích thước làm thuộc tính tùy chọn. & NBSP; Mã HTML được đưa ra bên dưới & nbsp; thể hiện việc sử dụng thẻ với nhiều thuộc tính để tạo các điều khiển ListBox:
.
HTML Forms
Demonstrates creating Listbox Input Control for Web Page Form
List of Countries
United States of America
Germany
India
United Kingdom
List of Countries with preselected value
United States of America
Germany
India
United Kingdom
[/html]
Đầu ra của mã HTML để tạo các hộp danh sách được hiển thị bên dưới:
Menu con
Các menu chọn lọc có thể được chia thành các loại trình con. Để tạo thẻ Submenus được sử dụng cùng với thẻ. Phần còn lại của các thuộc tính của thẻ vẫn giữ nguyên.
.
HTML Forms
Demonstrates creating Select Menu with Submenues Input Control for Web Page Form
Book your reservation
Breakfast 09:00 AM
Breakfast 10:00 AM
Lunch 01:00 PM
Lunch 02:00 PM
[/html]
Đầu ra của mã HTML để tạo Submenus được hiển thị bên dưới:
Điều khiển đầu vào vùng văn bản
Thẻ được sử dụng để tạo các điều khiển đầu vào TextAreas. Ngoài tên là thuộc tính, có một số thuộc tính tùy chọn có thể được sử dụng với & nbsp; nhãn:
cols - được sử dụng để chỉ định chiều rộng của vùng văn bản trong các hàng ký tự - được sử dụng để chỉ định chiều cao của khu vực văn bản
rows – used to specify the height of the text area
Mã HTML được đưa ra dưới đây & nbsp; thể hiện việc sử dụng thẻ để tạo các điều khiển vùng văn bản:
[HTML] HTML Forms thể hiện việc tạo Điều khiển đầu vào TextArea cho biểu mẫu trang web Địa chỉ: Địa chỉ: Địa chỉ: Tên xây dựng Trạng thái số đường phố [/HTML]
HTML Forms
Demonstrates creating TextArea Input Control for Web Page Form
Address:
Address:
Address:
Building name
Street Number
State
[/html]
Đầu ra của mã HTML để tạo vùng văn bản được hiển thị bên dưới:
Nút điều khiển đầu vào
Các nút điều khiển đầu vào được tạo bằng thẻ hoặc thẻ.
Tạo các nút thông qua TAG: Thẻ có giá trị của thuộc tính loại dưới dạng bản gửi, hãy đặt lại, thiết lập lại hoặc nút nút được sử dụng để tạo nút gửi, nút đặt lại hoặc các nút khác tương ứng. Ngoài tên là thuộc tính, thuộc tính giá trị cũng được sử dụng, hiển thị văn bản trên nút. Tạo các điều khiển gửi, đặt lại và nút:
The tag with the value of the type attribute as “submit”,
“reset” or “button” is used to create a Submit Button, Reset Button or other Buttons respectively. Apart from the name as the attribute, value attribute is also used, which displays text on the button. The HTML code given below demonstrates the use of tag with type attribute as “submit”, “reset” and “button” to create Submit, Reset and Button controls:
.
HTML Forms
Demonstrates creating Submit, Reset and Other Buttons Input Control with input tag for Web Page Form
Name:
[/html]
Đầu ra của mã HTML để tạo các nút bằng thẻ được hiển thị bên dưới:
Tạo các nút thông qua TAG: Thẻ có giá trị của thuộc tính loại dưới dạng bản gửi, hãy đặt lại, thiết lập lại hoặc nút nút được sử dụng để tạo nút gửi, nút đặt lại hoặc các nút khác tương ứng. Khi sử dụng thẻ thẻ đóng tương ứng của nó cũng cần được sử dụng. Ưu điểm của việc sử dụng thẻ là các hình ảnh cũng có thể được thực hiện để hoạt động như một nút. , Đặt lại và điều khiển nút:
The tag with the value of the type attribute as “submit”, “reset” or “button” is used to create a Submit Button, Reset Button or other Buttons respectively. When using tag its corresponding closing tag also needs to be used. The
advantage of using tag is that the images can also be made to function as a button. The HTML code given below demonstrates the use of tag with type attribute as “submit”, “reset” and “button” to create Submit, Reset and Button controls:
.
HTML Forms
Demonstrates creating Submit, Reset and Other Buttons Input Control with button tag for Web Page Form
Name:
Submit
Reset
Forgot Password
Phim tăt
Các phím tắt có thể được tạo cho bất kỳ hình thức điều khiển đầu vào nào. Thuộc tính của Access AccessKey được sử dụng để tạo phím tắt cho bất kỳ điều khiển đầu vào biểu mẫu nào. Sử dụng giá trị ALT+ của AccessKey trên bàn phím tập trung điều khiển đầu vào mà AccessKey được áp dụng. Mã HTML được đưa ra dưới đây cho thấy việc sử dụng các phím tắt bàn phím:
.
HTML Forms
Demonstrates keyboard shortcut for different Input Control of form for Web Page
Keyboard Shortcuts: Alt+N for Name Control, Alt+P for Password Control and Alt+S for Submit Control
Name:
Password:
[/html]
Đầu ra của mã HTML để chứng minh việc sử dụng thuộc tính phím tắt bàn phím được hiển thị bên dưới:
Thuộc tính đọc
Thuộc tính đọc có thể được áp dụng cho bất kỳ điều khiển đầu vào biểu mẫu nào. Khi thuộc tính ReadOnly được áp dụng, người dùng không thể thay đổi nội dung của điều khiển đầu vào. Mã HTML được đưa ra dưới đây cho thấy việc sử dụng thuộc tính READOnly:
.
HTML Forms
Demonstrates Readonly Attribute on Input Control of Web Page Form
Name:
Password:
[/html]
Đầu ra của mã HTML để chứng minh việc sử dụng thuộc tính READOnly được hiển thị bên dưới: Đầu ra:
Thuộc tính bị vô hiệu hóa
Thuộc tính bị vô hiệu hóa có thể được áp dụng cho bất kỳ điều khiển đầu vào biểu mẫu nào. Khi thuộc tính bị vô hiệu hóa được áp dụng, người dùng không thể sử dụng điều khiển đầu vào bị vô hiệu hóa. Mã HTML được đưa ra dưới đây cho thấy việc sử dụng thuộc tính bị vô hiệu hóa:
.
HTML Forms
Demonstrates Disabled Attribute on Input Control of Web Page Form
Name:
Password:
[/html]
Đầu ra của mã HTML để chứng minh việc sử dụng thuộc tính bị vô hiệu hóa được hiển thị bên dưới:
Hoàn thành biểu mẫu web
Mã HTML được đưa ra dưới đây cho thấy việc sử dụng tất cả các thẻ với các thuộc tính và thẻ loại khác nhau cũng như thẻ để tạo biểu mẫu web HTML hoàn chỉnh:
.
HTML Forms
Demonstrates creating HTML Form
Name:
Password:
Vehicle Type:
Bike
Car
SUV
Cycle
Gender:
Male
Female
Countries:
United States of America
Germany
India
United Kingdom
Companies:
Audi
Mercedes
Volvo
Toyota
Address:
[/html]
Đầu ra của mã HTML ở trên được hiển thị bên dưới:
Nhóm các điều khiển đầu vào biểu mẫu
Thẻ, cùng với thẻ được sử dụng để nhóm liên quan hoặc tập hợp các điều khiển đầu vào biểu mẫu. Mục đích của nhóm này là thiết kế trang nhã trang web mẫu. Mã HTML để chứng minh việc sử dụng với thẻ được đưa ra dưới đây:
. [/HTML]
HTML Forms
Demonstrates creating HTML Form with Grouping
Personal Information
Name:
Password:
Gender:
Male
Female
Economic Data
Vehicle Type:
Bike
Car
SUV
Cycle
Countries:
United States of America
Germany
India
United Kingdom
Companies:
Audi
Mercedes
Volvo
Toyota
Residence Data
Address:
[/html]
Đầu ra của mã HTML ở trên được hiển thị bên dưới:
Nhóm các điều khiển đầu vào biểu mẫu