文字排版
text-decoration-style
用於控制文字裝飾樣式的工具。
| 類別 | 樣式 |
|---|---|
decoration-solid | text-decoration-style: solid; |
decoration-double | text-decoration-style: double; |
decoration-dotted | text-decoration-style: dotted; |
decoration-dashed | text-decoration-style: dashed; |
decoration-wavy | text-decoration-style: wavy; |
範例
基本範例
使用像是 decoration-dotted 和 decoration-dashed 的工具來改變元素的文字裝飾樣式
decoration-solid
The quick brown fox jumps over the lazy dog.
decoration-double
The quick brown fox jumps over the lazy dog.
decoration-dotted
The quick brown fox jumps over the lazy dog.
decoration-dashed
The quick brown fox jumps over the lazy dog.
decoration-wavy
The quick brown fox jumps over the lazy dog.
<p class="underline decoration-solid">The quick brown fox...</p><p class="underline decoration-double">The quick brown fox...</p><p class="underline decoration-dotted">The quick brown fox...</p><p class="underline decoration-dashed">The quick brown fox...</p><p class="underline decoration-wavy">The quick brown fox...</p>響應式設計
前綴a text-decoration-style 工具 與像 md: 這樣的斷點變體一起使用，以便僅在中等 螢幕尺寸及以上套用該工具
<p class="underline md:decoration-dashed ..."> <!-- ... --></p>在變體文件中了解更多關於使用變體的信息。
