class trong HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 < html > < head > <style> h1.intro { color : blue ; } p.important { color : green ; } ...
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<html> <head> <style> h1.intro { color: blue; } p.important { color: green; } </style> </head> <body> <h1 class="intro">Tiêu đề 1</h1> <p>Đoạn văn bản.</p> <p class="important">Lưu ý đây là một đoạn văn bản quan trọng. :)</p> </body> </html> |
Demo
Định nghĩa và cách sử dụng
Thuộc tính cho phép bạn sử dụng một hoặc nhiều class trên một thẻ.
Thuộc tính chủ yếu được sử dụng để trỏ tới một class trong CSS. Tuy nhiên, nó cũng có thể được JavaScript sử dụng (thông qua HTML DOM) để thay đổi các thành phần trong HTML bằng cách gọi một class cụ thể.
Trình duyệt hỗ trợ
Thuộc tính | |||||
---|---|---|---|---|---|
class | Có | Có | Có | Có | Có |
Khác nhau giữa HTML 4.01 và HTML5
Trong HTML5, thuộc tính class có thể được sử dụng trên mọi thẻ HTML (hợp lệ trên mọi thẻ HTML. Tuy nhiên, nó không phải lúc nào cũng hữu ích).
Trong HTML 4.01, thuộc tính class không thể được sử dụng với các thẻ : <base>, <head>, <html>, <meta>, <param>, <script>, <style>và <title>.
Cú pháp
1 |
<element class="tên"> |
Giá trị thuộc tính
Giá trị | Miêu tả |
---|---|
Tên class | Bạn có thể sử dụng một hoặc nhiều class cho một thẻ. Sử dụng dấu cách để phân cách giữa tên các class, vd: <span class="left important">. Điều này cho phép bạn kết hợp nhiều class CSS cho một thẻ HTML. Luật đặt tên class:
|
Ví dụ thêm
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<!DOCTYPE html> <html> <head> <style> h1.intro { color: blue; text-align: center; } .important { background-color: yellow; } </style> </head> <body> <h1 class="intro important">Tiêu đề 1</h1> <p>Một đoạn văn bản.</p> </body> </html> |
Demo