19/09/2018, 15:08
Thẻ mới trong HTML5
Dưới đây là danh sách các thẻ mới và cách sử dụng chúng trong HTML5. Các thẻ có ý nghĩa trong HTML5 HTML5 cung cấp các thẻ mới để bạn có thể tạo ra một cấu trúc trang tốt hơn: Thẻ Miêu tả <article> Một bài viết trong trang <aside> Nội dung bên ngoài nội ...
Dưới đây là danh sách các thẻ mới và cách sử dụng chúng trong HTML5.
Các thẻ có ý nghĩa trong HTML5
HTML5 cung cấp các thẻ mới để bạn có thể tạo ra một cấu trúc trang tốt hơn:
| Thẻ | Miêu tả |
|---|---|
| <article> | Một bài viết trong trang |
| <aside> | Nội dung bên ngoài nội dung chính nhưng có tác dụng bổ trợ cho nội dung chính. |
| <bdi> | Quy định hướng của chữ từ trái sang phải hay từ phải sang trái |
| <details> | Thông tin chi tiết mà người dùng có thể xem hoặc ẩn đi |
| <dialog> | Tạo hộp thoại hoặc một cửa sổ |
| <figcaption> | Tạo chú thích cho thẻ <figure> |
| <figure> | Tạo nội dung khép kín như hình minh họa, biểu đồ, hình ảnh, v.v.. |
| <footer> | Phần cuối của một trang hoặc một khu vực trong trang |
| <header> | Phần đầu của một trang hoặc một khu vực trong trang |
| <main> | Nội dung chính của trang |
| <mark> | Đánh dấu hoặc làm nổi bật chữ |
| <menuitem> | Tạo một menu con mà người dùng có thể gọi ra từ một popup menu |
| <meter> | Tạo thước đo trong phạm vi định sẵn |
| <nav> | Khu vực dành cho các liên kết điều hướng trong trang |
| <progress> | Tạo thanh tiến trình công việc |
| <rp> | Nội dung thay thế trong trường hợp trình duyệt không hỗ trợ thẻ ruby |
| <rt> | Giải thích/phát âm của ký tự Đông Á |
| <ruby> | Chú thích ruby (dành cho kiểu chữ Đông Á) |
| <section> | Tạo một khu vực trong trang |
| <summary> | Tạo tiêu đề cho thẻ <details> |
| <time> | Hiển thị nội dung là ngày tháng/ thời gian |
| <wbr> | Quy định đoạn nội dung có thể xuống dòng để tránh hỏng giao diện |
Bạn có thể tìm hiểu thêm về Các thẻ có ý nghĩa trong HTML5
Các thẻ mới trong form
| Thẻ | Miêu tả |
|---|---|
| datalist | Tạo các lựa chọn gợi ý cho thẻ input |
| keygen | Tạo cặp khóa (key-pair) trong form |
| output | Hiển thị kết quả của một phép tính |
Bạn có thể tìm hiểu thêm về Các thẻ trong form HTML
Các kiểu input mới
| Kiểu input mới | Thuộc tính mới cho thẻ input |
|---|---|
|
|
Bạn có thể tìm hiểu thêm về các kiểu input cũ và mới trong bài Thẻ input trong HTML và Thuộc tính trong thẻ Input
Cú pháp cho thuộc tính trong HTML5
HTML5 cho phép bạn sử dụng 4 kiểu cú pháp dành cho thuộc tính.
Ví dụ dưới đây sẽ cho thấy những cú pháp khác nhau được sử dụng trong thẻ <input>:
| Kiểu | Ví dụ |
|---|---|
| Chỉ có tên thuộc tính | <input type="text" value="John" disabled> |
| Không có ngoặc | <input type="text" value=John> |
| Ngoặc kép | <input type="text" value="John Doe"> |
| Ngoặc đơn | <input type="text" value='John Doe'> |
Trong HTML5, tất cả 4 loại cú pháp đều có thể được sử dụng.
Đồ họa HTML5
| Thẻ | Miêu tả |
|---|---|
| <canvas> | Vẽ đồ họa sử dụng JavaScript |
| <svg> | Vẽ đồ họa sử dụng SVG |
Tìm hiểu thêm về Canvas trong HTML5
Tìm hiểu thêm về SVG trong HTML5
Các thẻ multimedia mới
| Thẻ | Miêu tả |
|---|---|
| <audio> | Chèn âm thanh, âm nhạc vào website |
| <embed> | Nhúng các ứng dụng bên ngoài vào website (như plug-in) |
| <source> | Nguồn để phát <video> và <audio> |
| <track> | Tạo phụ đề, chữ chạy trong khi phát <video> và <audio> |
| <video> | Chèn video hoặc một bộ phim vào website |
Tìm hiểu thêm về Video trong HTML5
Tìm hiểu thêm về Audio trong HTML5
