HTML5: Nhóm nội dung

Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực

Mỗi phần tử đều phải tuân theo quy tắc xác định nhóm nội dung có thể có. Những quy tắc này được nhóm thành các nhóm nội dung phổ biến. Mỗi phần tử HTML có thể không, hoặc thuộc về một hoặc thuộc về nhiều nhóm nội dung, mỗi nhóm nội dung sẽ có những quy tắc theo đó nội dung của phần tử phải phải tuân theo.

Dưới đây sẽ trình bày chi tiết từng nhóm nội dung:

Content_categories

Metadata

Các phần tử thuộc về nhóm này sẽ chỉnh sửa cách thể hiện hoặc hành vi của phần còn lại trang web, thiết lập các liên kết tới các trang web khác, hoặc truyền tải thông tin khác ngoài thông tin chính thống.

Các phần tử thuộc nhóm nội dung Metadata gồm: <base>, <command>, <link>, <meta>, <noscript>, <script>, <style> và <title>.

Flow

Các phần tử thuộc nhóm nội dung này thường chứa văn bản hoặc nội dung được nhúng vào trong các phần tử.

Những phần tử thuộc nhóm nội dung Flow gồm : <a>, <abbr>, <address>, <article>, <aside>, <audio>, <b>,<bdo>, <bdi>, <blockquote>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <data>, <datalist>, <del>, <details>, <dfn>, <div>, <dl>, <em>, <embed>, <fieldset>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <i>, <iframe>, <img>, <input>, <ins>, <kbd>, <keygen>, <label>, <main>, <map>, <mark>, <math>, <menu>, <meter>, <nav>, <noscript>, <object>, <ol>, <output>, <p>, <pre>, <progress>, <q>, <ruby>, <s>, <samp>, <script>, <section>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <table>, <template>, <textarea>, <time>, <ul>, <var>, <video>, <wbr> và text.

Có một số phần tử cũng thuộc về Flow nhưng chỉ khi nó thỏa mãn những điều kiện tương ứng nào đó. Dưới đây là những phần tử này:

· <area>, nếu nó là con của thẻ <map>

· <link>, nếu nó sử dụng thuộc tính itemprop

· <meta>, nếu nó sử dụng thuộc tính itemprop

· <style>, nếu nó sử dụng thuộc tính scoped

Sectioning

Các phần tử thuộc về nhóm nội dung này sẽ tạo một thành phần của toàn bộ cấu trúc hiện thời của trang web để định nghĩa phạm vi của các phần tử <header>, <footer> và nhóm nội dung Heading.

Các phần tử của nhóm nội dung Sectioning gồm: <article>, <aside>, <nav> và <section>.

Heading

Các phần tử thuộc nhóm nội dung này sẽ định nghĩa tiêu đề của một thành phần được đánh dấu tường minh bởi phần tử thuộc nhóm Sectioning content hoặc được định nghĩa ngầm định bởi chính nhóm này.

Các phần tử của nhóm nội dung Heading bao gồm <h1>, <h2>, <h3>, <h4>, <h5>, <h6> và <hgroup>.

Lưu ý: Mặc dù có khả năng chứa một số nội dung tiêu đề, nhưng thẻ <header> lại không thuộc nhóm Heading.

Phrasing

Phrasing định nghĩa văn bản và đánh dấu nơi chứa văn bản đó.

Các phần tử thuộc nhóm này gồm: <abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen>, <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr> và plain text.

Những thẻ sau đây sẽ thuộc về nhóm Phrasing nếu thỏa mãn điều kiện tương ứng:

· <a>, nếu nó chỉ chứa nội dung phrasing

· <area>, nếu nó là con của thẻ <map>

· <del>, nếu nó chỉ chứa nội dung phrasing

· <ins>, nếu nó chỉ chứa nội dung phrasing

· <link>, nếu nó sử dụng thuộc tính itemprop

· <map>, nếu nó chỉ chứa nội dung phrasing

· <meta>, nếu nó sử dụng thuộc tính itemprop

Embedded

Các phần tử thuộc nhóm này sẽ import tài nguyên khác hoặc chèn nội dung từ ngôn ngữ đánh dấu hay namespace khác vào trang web.

Các phần tử thuộc nhóm nội dung Embedded gồm: <audio>, <canvas>, <embed>, <iframe>, <img>, <math>, <object>, <svg>, <video>.

Interactive

Nhóm Interactive bao gồm các phần tử được thiết kế đặc biệt nhằm mục đích tương tác người dùng.

Các phần tử thuộc nhóm nội dung Interactive gồm: <a>, <button>, <details>, <embed>, <iframe>, <keygen>, <label>, <select> và <textarea>.

Những phần tử dưới đây sẽ thuộc về Interactive nếu thỏa mãn những điều kiện tương ứng:

· <audio>, nếu nó sử dụng thuộc tính controls

· <img>, nếu nó sử dụng thuộc tính usemap

· <input>, nếu nó sử dụng thuộc tính type

· <menu>, nếu nó sử dụng thuộc tính type

· <object>, nếu nó sử dụng thuộc tính usemap

· <video>, nếu nó sử dụng thuộc tính controls

Form

Nhóm nội dung này bao gồm các phần tử con của phần tử <form> (nằm trực tiếp trong <form> hoặc sử dụng thuộc tính form để chỉ định phần tử <form> nó thuộc về).

Các phần tử thuộc nhóm nội dung Form gồm: <button>, <fieldset>, <input>, <keygen>, <label>, <meter>, <object>, <output>, <progress>, <select>, <textarea>.

Nhóm nội dung Form được chia thành những nhóm nhỏ như sau:

listed

Bao gồm các phần tử: <button>, <fieldset>, <input>, <keygen>, <object>, <output>, <select> và <textarea>.

labelable

Bao gồm các phần tử kết hợp được với phần tử <label>, <button>, <input>, <keygen>, <meter>, <output>, <progress>, <select> và <textarea>.

submittable

Bao gồm các phần tử mà giá trị của chúng có thể được gửi đi khi submit form dữ liệu: <button>, <input>, <keygen>, <object>, <select> và <textarea>.

resettable

Bao gồm các phần tử mà giá trị của chúng có thể được reset khi reset form dữ liệu: <input>, <keygen>, <output>, <select> và <textarea>.

 

Sectioning root

Phần tử thuộc nhóm nội dung này có thể có cấu trúc của riêng nó, nhưng các thành phần và tiêu đề bên trong nó lại không thể hiện ra ở trình duyệt.

Cùng với <body> là một Sectioning root còn có những phần tử sau có thể đưa nội dung bên ngoài vào trong trang web: <blockquote>, <details>, <fieldset>, <figure> và <td>.

» Tiếp: Các thuộc tính Global
« Trước: Web Worker
Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực
Copied !!!