Thuộc tính trang trí văn bản CSS
Ví dụ
Đặt các kiểu trang trí văn bản khác nhau cho các phần tử <h1>, <h2> và <h3>:
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
}
h4 {
text-decoration: underline
overline;
}
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và cách sử dụng
Thuộc tính text-decoration
chỉ định cách trang trí được thêm vào văn bản và là thuộc tính viết tắt cho:
- dòng trang trí văn bản (bắt buộc)
- màu sắc trang trí văn bản
- kiểu trang trí văn bản
- văn bản-trang trí-độ dày
Giá trị mặc định: | không có hiện tạiColor rắn tự động |
---|---|
Thừa hưởng: | KHÔNG |
Hoạt hình: | không, hãy xem các thuộc tính riêng lẻ . Đọc về hoạt hình |
Phiên bản: | CSS1, được đổi mới trong CSS3 |
Cú pháp JavaScript: | đối tượng .style.textDecoration="gạch chân" Hãy dùng thử |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Property | |||||
---|---|---|---|---|---|
text-decoration | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
Cú pháp CSS
text-decoration: text-decoration-line text-decoration-color
text-decoration-style text-decoration-thickness |initial|inherit;
Giá trị tài sản
Value | Description | Demo |
---|---|---|
text-decoration-line | Sets the kind of text decoration to use (like underline, overline, line-through) | Demo ❯ |
text-decoration-color | Sets the color of the text decoration | Demo ❯ |
text-decoration-style | Sets the style of the text decoration (like solid, wavy, dotted, dashed, double) | Demo ❯ |
text-decoration-thickness | Sets the thickness of the decoration line | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Thêm ví dụ
Ví dụ
Thêm trang trí văn bản:
h1 {
text-decoration: underline overline dotted red;
}
h2 {
text-decoration: underline wavy
blue 5px;
}
Hãy tự mình thử »Trang liên quan
Hướng dẫn CSS: Trang trí văn bản CSS
Tham chiếu DOM HTML: thuộc tính textDecoration