Thuộc tính content
Định nghĩa và sử dụng Thuộc tính content sử dụng kèm với bộ chọn :before, :after để chèn nội dung được tạo. Cấu trúc tag { content: giá trị; } Với thuộc tính và giá trị như sau: Thuộc tính giá trị Mô tả content Nội dung Nội dung trong dấu ngoặc sẽ được thêm vào thành phần. […]
Định nghĩa và sử dụng
Thuộc tính content sử dụng kèm với bộ chọn :before, :after để chèn nội dung được tạo.
Cấu trúc
tag {
content: giá trị;
}
Với thuộc tính và giá trị như sau:
| Thuộc tính | giá trị | Mô tả |
|---|---|---|
| content | Nội dung | Nội dung trong dấu ngoặc sẽ được thêm vào thành phần. |
| attr(x) | Nội dung của thuộc tính html sẽ được thêm vào nội dung thành phần. | |
| close-quote | Thêm dấu ngoặc đóng vào thành phần. | |
| open-quote | Thêm dấu ngoặc mở vào thành phần. | |
| no-close-quote | bỏ dấu ngoặc đóng của thành phần. | |
| no-open-quote | bỏ dấu ngoặc mở của thành phần. | |
| inherit | Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài). |
Chú ý: Hai thuộc thính close-quote và open-quote phải được dùng chung nhau, không thể thiếu một trong hai.
Ví dụ
Html viết:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head> </head> <body> <p>Học HTML - CSS</p> </div> </body> </html>
Hiển thị trình duyệt khi chưa có CSS:
Học HTML – CSS
CSS viết:
p:after {
content: " - kiến thức nhỏ cho web hiện đại.";
}
Hiển thị trình duyệt:
Học HTML – CSS
Trình duyệt hỗ trợ
- Internet Explorer
- Firefox
- Opera
- Google Chrome
- Safari
