text-decoration-color CSS3

text-decoration-color は、テキスト装飾線の色を指定します。 色はカラーコードや 色名、RGBカラー値で指定します。

名前:text-decoration-color
値: <color>
初期値:current color（現在の色）
適用対象:全ての要素
継承:しない
パーセンテージ:n/a
メディア:visual（視覚的）
計算値:計算色
アニメーション:color として

HTML source

<!DOCTYPE html>
<html>
 <head>
  <title></title>
  <style>
   p.test1 { text-decoration-line: underline;text-decoration-color: red; }
   p.test2 { text-decoration-line: underline;text-decoration-color: #ff0000; }
   p.test3 { text-decoration-line: underline;text-decoration-color: rgb(255,0,0); }
   p.test4 { text-decoration-line: underline;text-decoration-color: rgb(100%, 0%, 0%); }
  </style>
 </head>
 <body>
   <p class="test1">red</p>
   <p class="test2">#ff0000</p>
   <p class="test3">rgb(255,0,0)</p>
   <p class="test4">rgb(100%, 0%, 0%)</p>
 </body>
</html>

display

red

#ff0000

rgb(255,0,0)

rgb(100%, 0%, 0%)

※ red、#ff0000、rgb(255,0,0)、rgb(100%, 0%, 0%) は全て同じ赤色です。
※ Google Chrome 64.0.3282.186、Firefox58.0.2にて表示確認（2018/3/13）

上に戻る