Thuộc tính kiểu trang trí văn bản CSS
Ví dụ
Đặt các kiểu trang trí văn bản khác nhau:
div.a
{
text-decoration-line: underline;
text-decoration-style: solid;
}
div.b
{
text-decoration-line: underline;
text-decoration-style: wavy;
}
div.c
{
text-decoration-line: underline;
text-decoration-style: double;
}
div.d
{
text-decoration-line: overline underline;
text-decoration-style: wavy;
}
Hãy tự mình thử »Định nghĩa và cách sử dụng
Thuộc tính text-decoration-style
đặt kiểu trang trí văn bản (như liền khối, lượn sóng, chấm, nét đứt, gấp đôi).
Mẹo: Ngoài ra, hãy xem thuộc tính text-trang trí , đây là thuộc tính ngắn gọn cho dòng trang trí văn bản, kiểu trang trí văn bản, màu sắc trang trí văn bản và độ dày trang trí văn bản.
Giá trị mặc định: | chất rắn |
---|---|
Thừa hưởng: | KHÔNG |
Hoạt hình: | KHÔNG. Đọc về hoạt hình |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | object .style.textDecorationStyle="wavy" 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.
Các số theo sau -moz- chỉ định phiên bản đầu tiên hoạt động với tiền tố.
Property | |||||
---|---|---|---|---|---|
text-decoration-style | 57.0 | 79.0 | 36.0 6.0 -moz- |
12.1 | 44.0 |
Cú pháp CSS
text-decoration-style: solid|double|dotted|dashed|wavy|initial|inherit;
Giá trị tài sản
Value | Description | Play it |
---|---|---|
solid | Default value. The line will display as a single line | Demo ❯ |
double | The line will display as a double line | Demo ❯ |
dotted | The line will display as a dotted line | Demo ❯ |
dashed | The line will display as a dashed line | Demo ❯ |
wavy | The line will display as a wavy line | Demo ❯ |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
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 textDecorationStyle