第11回 W3C CSS Module 仕様書もくもく会@東京は残念ながら台風の影響でリモートでの参加になりましたが、もくもくした結果をまとめておきます。
読んだところ
- Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specification 16 Text、及びその日本語訳
- CSS Text Decoration Module Level 3 - 2.Line Decoration: Underline, Overline, and Strike-Through、及びその日本語訳
ほぼ text-decoration
しか読めませんでしたね...
学んだり確認したこと - text-decoration
の適用されかた
text-decoration
は、Inherited: No(継承: なし)ですが
プロパティはその要素によって生成されるすべてのボックスに影響を与え、そしてさらにインラインを分割する任意のブロックレベルボックスフロー内に伝播される
ので、プロパティとして継承はされませんが、子要素のテキストにも装飾が適用されます。
装飾に使用される色はtext-decoration
プロパティがセットされた要素のcolor
プロパティの値を使用するので、子要素でcolor
プロパティが違う要素であっても装飾の色にはtext-decoration
がセットされた要素のcolor
が使用されます。
テキスト装飾に要求される色は、'text-decoration'が設定される要素の'color'プロパティ値から算出されなければならない。たとえ子孫要素が異なる'color'値を持つ場合でも、装飾の色は同じままでなければならない。
color: #d30;
の下線も通常テキストの色になっている
<span style="text-decoration: underline">
text-decoration: underline;
<span style="color: #d30;">color: #d30;</span>
</span>
またテキスト以外(画像やインラインブロック要素)には、装飾はレンダリングされません。
ユーザーエージェントは、テキストでないコンテンツにこれらのテキスト装飾をレンダリングしてはならない。たとえば、画像やインラインブロックに下線を引いてはならない。
style="display: inline-block;"
なテキストには下線がレンダリングされない
<span style="text-decoration: underline">
text-decoration: underline;
<span style="display: inline-block">display: inline-block</span>
</span>
CSS Text Decoration Module Level 3
では、text-decoration-skip
というプロパティが新しくできていて、そのプロパティの初期値がobjects
(画像やインラインブロック)となっていて分かりやすくなったように思いました。
またテキストであれば、空白のテキストノードにも装飾が適用されてしまいますが、将来的には上述のtext-decoration-skip
の値をspaces
にしてやれば、空白には装飾があたらなくなるので記憶の片隅にでもいれておこうかと。
それにしてもせっかく東京に来ていて久々にオフライン参加できそうだったのに、台風のせいでリモート参加になってしまい残念でした。台風恨めしい... 次回は、9/13(火)とのことですが、東京にいる可能性はちょっと少なめかなあ...