1. はじめに
この小節は規範的ではありません。
このモジュールはテキスト装飾、すなわちフォントと組版規則に従って組版された後のテキストのグリフを装飾することを扱います。 ([CSS-TEXT-3] および [CSS-FONTS-3] を参照。) これらの機能は、純粋な装飾目的だけでなく、強調を示したり、敬称に使ったり、挿入・削除・誤字など編集上の変更を示す場合にも伝統的に用いられます。
CSSレベル1および2では、西洋の組版慣習に適した非常に基本的な線の装飾(下線、上線、取り消し線)のみ定義されていました。 このモジュールのレベル3では、これらの装飾の色、スタイル、位置、連続性を変更する機能が追加され、 さらに強調記号(東アジアの組版で伝統的に使用される)や、 シャドウ(レベル2で提案され延期されたもの)が導入されます。
1.1. モジュール同士の関係
このモジュールは、[CSS2] 第16章で定義されたテキスト装飾機能を置き換え、拡張します。
1.2. 値の定義
この仕様は CSSプロパティ定義の慣例([CSS2])に従い、 値定義の構文([CSS-VALUES-3])を使用しています。 この仕様で定義されていない値型は CSS Values & Units [CSS-VALUES-3] で定義されています。 他のCSSモジュールとの組み合わせによって、これらの値型の定義が拡張される場合があります。
各プロパティ定義に記載されているプロパティ固有の値に加えて、 この仕様で定義されたすべてのプロパティは、 CSS全体キーワードもプロパティ値として受け入れます。 読みやすさのため、これらは明示的に繰り返していません。
1.3. 用語集
この仕様で使用される character、letter、content language という用語は [CSS-TEXT-3] で定義されています。 その他の用語や概念は、[CSS2] および [CSS-WRITING-MODES-4]で定義されています。
2. 線による装飾:下線、上線、取り消し線
以下のプロパティは、要素の内容に追加される線による装飾を説明します。 インラインボックスに指定または伝播されると、 そのボックスは その装飾の装飾ボックスとなり、 装飾がすべてのフラグメントに適用されます。 その後、装飾はインラインを分割するインフローの ブロックレベルボックスにも伝播されます (CSS2.1 セクション9.2.1.1参照)。 ブロックコンテナで インラインフォーマットコンテキストを確立するものに指定または伝播される場合、 装飾は全てのインフロー インラインレベルの 子要素を囲む匿名インラインボックスに伝播されます。 ルビコンテナに指定または伝播される場合、 装飾はルビベースのみに伝播されます。 その他すべてのボックスタイプでは、装飾はすべてのインフロー子要素に伝播されます。
注意:テキスト装飾はアウトオブフローの子孫や、 インラインブロックやインラインテーブルなどのアトミックなインラインレベル子要素の内容には伝播されません。 また、インラインボックスのインライン子要素にも伝播されませんが、 そのようなボックスには適用されます。
下線、上線、取り消し線は、非置換 インラインボックスにのみ描画され、 すべてのテキスト(空白、文字間隔、単語間隔を含む)にわたって描画されますが、 行頭と行末の空白(空白、文字間隔、単語間隔)は除外されます。 アトミックインライン(画像やインラインブロックなど)は装飾されません。 装飾ボックスのマージン、ボーダー、パディングは常に除外されますが、 子孫のインラインボックスのマージン、ボーダー、パディングは除外されません。
注意:CSS 2.1では常にマージン、ボーダー、パディングを除外することが要求されていました。
このレベルでは、デフォルトで装飾ボックスのマージン、ボーダー、パディングのみ除外します。
将来的にCSS2.1もこの新しいデフォルトに合わせて更新される可能性があります。
また、先頭・末尾の空白を装飾する制御はレベル4で導入される予定であり、
デフォルトでHTMLの
ins
および
del
要素に適用されます。
UAは、下線や上線がグリフのインク部分を横切る場合や、グリフ輪郭の両側にある程度の距離まで、 下線や上線を中断してもよいとされます。 この挙動はこのレベルでは制御できませんが、レベル4でさらに定義されます。 ただし、取り消し線は常に連続でなければなりません。

グリフインクの回避
UAが下線や上線をグリフ境界で中断する場合、 境界での線の形状はグリフの形状に従うべきです。

ボウル内の下線部分を隠すことで文字がよりすっきり見え、 下線の曲線端が外側輪郭を沿うことで文字を通して下線が連続している印象を与えます。
子要素を相対位置で配置すると、そのテキストに適用されるすべての装飾も子要素のテキストとともに移動しますが、 装飾の初期位置の計算には影響しません。 visibility プロパティや text-shadow、 フィルター、その他のグラフィック変形も、そのボックスに適用される全てのテキスト装飾(祖先ボックスから伝播されたものを含む)に影響しますが、 初期位置や太さの計算には影響しません。 (アトミックインライン上や非置換インラインボックスのマージン・ボーダー・パディング上に描画される線装飾の場合も、 影響を受けたアトミックインライン/非置換インラインボックスに関連付けられます。装飾ボックスではありません。)
blockquote { text-decoration: underline; color: blue; } em { display: block; } cite { color: fuchsia; }
<blockquote> <p> <span> Help, help! <em> I am under a hat! </em> <cite> —GwieF </cite> </span> </p> </blockquote>
...blockquote要素の下線はspan要素を囲む匿名インラインボックスに伝播されるため、
「Help, help!」のテキストは青色で、青い下線がその匿名インラインの下に表示され、色はblockquote要素から取得されます。
<em>text</em>
のemブロック内のテキストも下線が引かれます。これは下線が伝播されたインフローブロック内にあるためです。
最後の行のテキストはフューシャ色ですが、その下の下線は依然として匿名インライン要素の青い下線が表示されます。
この図は上記例で関わるボックスを示しています。
丸い水色線は段落要素内のインライン内容を囲む匿名インライン要素、
丸い青い線はspan要素、
オレンジ色の線はブロックを表します。
注意:線による装飾はボックスツリーを通して伝播され、継承ではありません。 したがって、display: contents が指定された要素では 子孫に影響しません。
2.1. テキスト装飾線:text-decoration-line プロパティ
名前: | text-decoration-line |
---|---|
値: | none | [ underline || overline || line-through || blink ] |
初期値: | none |
適用対象: | すべての要素 |
継承: | no(ただし上記本文参照) |
パーセンテージ: | 該当なし |
算出値: | 指定されたキーワード |
正規順序: | 文法通り |
アニメーション型: | 離散値 |
どのような線装飾を要素に追加するかを指定します。 各値の意味は次の通りです:
- none
- テキスト装飾を生成も抑制もしません。
- underline
- 各行のテキストに下線を引きます。
- overline
- 各行のテキストの上側(下線の反対側)に線を引きます。
- line-through
- 各行のテキストの中央に線を引きます。
- blink
- テキストが点滅します(表示と非表示を交互に切り替えます)。 適合するユーザーエージェントは単に点滅させない場合があります。 点滅させないことは WAI-UAAG のチェックポイント3.3を満たすための一つの方法です。 この値は 非推奨 であり、Animations [CSS-ANIMATIONS-1] の利用が推奨されます。
注意: 縦書きモードでは、text-underline-position によって下線と上線の位置が入れ替わることがあります。 これにより下線の位置が言語固有の好みに自動で合わせられます。
2.2. テキスト装飾スタイル:text-decoration-style プロパティ
名前: | text-decoration-style |
---|---|
値: | solid | double | dotted | dashed | wavy |
初期値: | solid |
適用対象: | すべての要素 |
継承: | no |
パーセンテージ: | 該当なし |
算出値: | 指定されたキーワード |
正規順序: | 文法通り |
アニメーション型: | 離散値 |
このプロパティは要素に指定したテキスト装飾線のスタイルを指定します。値の意味は border-style プロパティ [CSS-BACKGROUNDS-3] と同じです。wavy は波線を意味します。
テキスト装飾のスタイルは、要素から発生したすべての装飾で同じでなければならず、子孫ボックスで異なるスタイルが指定されていても変わりません。
2.3. テキスト装飾の色:text-decoration-color プロパティ
名前: | text-decoration-color |
---|---|
値: | <color> |
初期値: | currentcolor |
適用対象: | すべての要素 |
継承: | no |
パーセンテージ: | 該当なし |
算出値: | 計算された色 |
正規順序: | 文法通り |
アニメーション型: | 計算値型による |
このプロパティは、text-decoration-lineで指定された下線・上線・取り消し線の色を指定します。
テキスト装飾の色は、要素から発生したすべての装飾で同じでなければならず、子孫ボックスで異なる色が指定されていても変わりません。
2.4. テキスト装飾ショートハンド:text-decoration プロパティ
名前: | text-decoration |
---|---|
値: | <'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'> |
初期値: | 各プロパティ参照 |
適用対象: | 各プロパティ参照 |
継承: | 各プロパティ参照 |
パーセンテージ: | 各プロパティ参照 |
算出値: | 各プロパティ参照 |
アニメーション型: | 各プロパティ参照 |
正規順序: | 文法通り |
このプロパティは、text-decoration-line、text-decoration-color、 text-decoration-style を一括で設定するショートハンドです。 省略された値は初期値となります。
注意: text-decoration 宣言で text-decoration-color および text-decoration-style の両方を省略した場合、 CSSレベル1および2と後方互換性があります。
:link { color: blue; text-decoration: underline; text-decoration: navy dotted underline; /* CSS1/CSS2 UAでは無視されます */ }
注意: このショートハンドは意図的に text-underline-position プロパティを除外しています。 これは言語や書記体系に依存する設定であり、コンテンツに基づいて決まるため、 継承されない text-decoration ショートハンドのスタイル設定とは独立してカスケード・継承できるようになっています。
2.5. 下線位置:text-underline-position プロパティ
名前: | text-underline-position |
---|---|
値: | auto | [ under || [ left | right ] ] |
初期値: | auto |
適用対象: | すべての要素 |
継承: | はい |
パーセンテージ: | 該当なし |
算出値: | 指定されたキーワード |
正規順序: | 文法通り |
アニメーション型: | 離散値 |
このプロパティは、要素に指定された下線の位置を設定します。 (祖先要素で指定された下線には影響しません。) left または right を単独で指定した場合も、auto が暗黙的に指定されます。
:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: under right; } :root:lang(zh), [lang|=zh] { text-underline-position: under left; }
各値の意味は以下の通りです:
- auto
-
ユーザーエージェントは任意のアルゴリズムで下線位置を決定できますが、アルファベットベースライン上または下に配置されなければなりません。
注意: デフォルトの下線位置はアルファベットベースライン付近が推奨されますが、 下付き文字(またはその他で下がった文字)を横切る場合や、 ハン文字やチベット文字など、アルファベット下線が高すぎるアジア系グリフに重なる場合は、 より低い位置や、under の説明通りemボックス端に合わせる方が適切です。
典型的な「アルファベット下線」はアルファベットベースラインすぐ下に位置します
- under
-
下線は要素のテキスト内容の下に配置されます。
この場合、通常下線はディセンダーを横切りません。
(「会計下線」と呼ばれることもあります。)
この値は、縦書き組版モードで、特定の側(leftまたはright)を指定したい場合に
left または
right
と組み合わせ可能です。
text-underline-position は継承され、 text-decoration のショートハンドではリセットされないため、 次の例では文書全体の下線位置を under に切り替えています。 これはディセンダーが長く複雑な書記体系や、添え字を多用する数式・化学式テキストなどに適しています。
:root { text-underline-position: under; }
注意: under値でも、 下線がグリフと衝突しないことは保証されません。 一部のフォントでは、ディセンダーやダイアクリティカルマークがフォントのディセント指標より下に伸びる場合があります。
- left
- 縦書き組版モードでは、下線は underと同様に揃えますが、 必ずテキストの左端に揃えます。 これにより下線がテキストの「over」側に描画される場合、上線も側を入れ替え「under」側に描画されます。
- right
- 縦書き組版モードでは、下線は underと同様に揃えますが、 必ずテキストの右端に揃えます。 これにより下線がテキストの「over」側に描画される場合、上線も側を入れ替え「under」側に描画されます。
![]() | ![]() |
left | right |
縦書き組版モードでは、text-underline-position の値 left および right により、下線をテキストの任意の側に配置できます。(横書き組版モードでは、両値とも auto として扱われます。)
線装飾の正確な位置や太さは、このレベルではUA定義です。 ただし、下線と上線についてはUAは、単一装飾ボックスから導出された装飾について、各行で単一の太さ・位置を使用しなければなりません。


正しい/誤った
<u>A<sup>B</sup><big>C</big>D</u>
の下線描画例


縦書きの中央ベースライン揃えのため、小さい縦組テキストの左下線が、大きなフォントサイズの子要素を横切ります。 下線は分断できませんが、より左側に位置調整することで 下線がすべての下線付きテキストに対応できます。
UAは、装飾ボックスがvertical-alignで baseline 以外にシフトされた場合や、 font-variant-position で添え字・上付きになった場合は、 線の位置を調整しなければなりません([CSS2]、[CSS-FONTS-3])。 ただし、装飾ボックスの子孫がそのようにスタイルされた場合は、線の位置や太さを調整してはなりません。 これにより、添え字や上付き文字に対して正しく下線や取り消し線などを装飾でき、 子孫によって祖先の装飾位置が歪むのを防ぎます。

上付き文字への下線例と、 上付き文字を含むテキストへの下線例
一部のフォント形式(OpenTypeなど)は、線装飾に適切な位置情報を提供できます。 UAはそのような情報(下線の太さや、適切なアルファベット下線位置など)を 必要に応じてフォントから利用すべきです。
注意: 通常、OpenTypeフォントのメトリクスは alphabetic下線の位置を示します。 一部(特にCJKフォント)では under left の位置となる場合もあります。 (この場合、フォントの下線メトリクスは通常emボックス下端に接します。) UAは誤ったフォントメトリクスを補正してもよいですが、必須ではありません。
3. 強調記号
東アジア文書では、テキストを強調するために各グリフの隣に小さな記号を付ける伝統があります。例:

アクセント強調(説明のため青色)が日本語テキストに適用された例
text-emphasis ショートハンドや、 text-emphasis-style、 text-emphasis-color ロングハンドで このような記号をテキストに適用できます。 text-emphasis-position プロパティは別途継承され、 強調記号のテキストに対する位置を設定できます。
3.1. 強調記号のスタイル:text-emphasis-style プロパティ
名前: | text-emphasis-style |
---|---|
値: | none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string> |
初期値: | none |
適用対象: | テキスト |
継承: | はい |
パーセンテージ: | 該当なし |
算出値: | キーワード none、形状と塗りつぶしを表すキーワードのペア、または文字列 |
正規順序: | 文法通り |
アニメーション型: | 離散値 |
このプロパティは要素のテキストに強調記号を適用します。 各値の意味は以下の通りです:
- none
- 強調記号なし。
- filled
- 形状は実線で塗りつぶされます。
- open
- 形状は中抜きになります。
- dot
- 小さな丸印を表示します。 塗りつぶしドットはU+2022「•」、中抜きドットはU+25E6「◦」です。
- circle
- 大きな丸印を表示します。 塗りつぶしサークルはU+25CF「●」、中抜きサークルはU+25CB「○」です。
- double-circle
- 二重丸印を表示します。 塗りつぶし二重丸はU+25C9「◉」、中抜き二重丸はU+25CE「◎」です。
- triangle
- 三角印を表示します。 塗りつぶし三角はU+25B2「▲」、中抜き三角はU+25B3「△」です。
- sesame
- ゴマ印(sesame)を表示します。 塗りつぶしゴマはU+FE45「﹅」、中抜きゴマはU+FE46「﹆」です。
- <string>
- 指定された文字列を強調記号として表示します。 著者は<string>に1文字以上指定しないようにしてください。 UAは複数のグラフクラスタからなる文字列を切り詰めるか無視する場合があります。
形状キーワードが指定され、filled/openのいずれも指定されていない場合、filledが既定となります。 filledまたはopenのみ指定した場合は、横書き組版モードではcircle、 縦書き組版モードではsesameが適用されます。
強調記号は要素のフォント設定で描画し、 ruby機能を追加し、サイズを50%縮小して表示します。 ただし、すべてのフォントで全てのグリフが揃っているわけではなく、 一部のフォントではこれらコードポイントの強調記号のサイズが不適切な場合もあるため、 UAは強調記号に適した既知のフォントを使用するか、 UAが記号を合成しても構いません。 縦書き組版モードでは、記号は必ず直立して表示します。 CJK文字と同様に、書字方向に合わせて回転しません。 横書き組版モード(縦書きモード内の横書き)での記号の向きはこのレベルでは未定義です (決定的なユースケースが出れば将来のレベルで定義される可能性があります)。
注意: 強調記号に適した良いフォントの例として、Adobeのオープンソース Kenten Generic OpenType Fontがあります。 これは強調記号専用に設計されています。
記号は各組版文字単位ごとに一度描画されます。 ただし、以下の場合は強調記号は描画されません:
- 単語区切りや、Unicodeのセパレータクラス(Z*)に属する文字。 (ただし結合文字と組み合わされたスペースには強調記号が描画されます。)
-
句読点――具体的にはUnicodeのP*一般カテゴリに属し、
NFKD
正規化して次の記号にならない文字。# U+0023 番号記号 % U+0025 パーセント記号 ‰ U+2030 パーミル記号 ‱ U+2031 一万分率記号 ٪ U+066A アラビア語パーセント記号 ؉ U+0609 アラビア・インド パーミル記号 ؊ U+060A アラビア・インド 一万分率記号 & U+0026 アンパサンド ⁊ U+204A ティロニアン記号ET @ U+0040 コマーシャルアット § U+00A7 セクション記号 ¶ U+00B6 段落記号 ⁋ U+204B 反転段落記号 ⁓ U+2053 揺れるダッシュ 〽️ U+303D 交替記号 - UnicodeクラスCc、Cf、Cnに属する制御文字や未割り当て文字
注意: どの文字に強調記号を付けるかの制御は レベル4で追加される予定です。 (句読点のリストは特に非CJK用にさらに見直される可能性があります。)
3.2. 強調記号の色:text-emphasis-color プロパティ
名前: | text-emphasis-color |
---|---|
値: | <color> |
初期値: | currentcolor |
適用対象: | テキスト |
継承: | はい |
パーセンテージ: | 該当なし |
算出値: | 計算された色 |
正規順序: | 文法通り |
アニメーション型: | 計算値型による |
このプロパティは強調記号の前景色を指定します。
注意: currentcolor キーワードは自分自身に計算され、 継承後に color の値に解決されます。 つまり text-emphasis-color はデフォルトでテキストのcolorと一致し、colorが要素ごとに変化しても追従します。
3.3. 強調記号ショートハンド:text-emphasis プロパティ
名前: | text-emphasis |
---|---|
値: | <'text-emphasis-style'> || <'text-emphasis-color'> |
初期値: | 各プロパティ参照 |
適用対象: | 各プロパティ参照 |
継承: | 各プロパティ参照 |
パーセンテージ: | 各プロパティ参照 |
算出値: | 各プロパティ参照 |
アニメーション型: | 各プロパティ参照 |
正規順序: | 文法通り |
このプロパティはtext-emphasis-style と text-emphasis-color を一括で設定するショートハンドです。 省略した値は初期値になります。
注意:text-emphasis-position はこのショートハンドでリセットされません。 通常、形状や色は変化しますが、位置は言語ごとに文書全体で一貫しているためです。 したがって位置は個別に継承されるべきです。
3.4. 強調記号の位置:text-emphasis-position プロパティ
名前: | text-emphasis-position |
---|---|
値: | [ over | under ] && [ right | left ]? |
初期値: | over right |
適用対象: | テキスト |
継承: | はい |
パーセンテージ: | 該当なし |
算出値: | 指定キーワード |
正規順序: | 文法通り |
アニメーション型: | 離散値 |
このプロパティは強調記号がどこに描画されるかを指定します。 [ right | left ] を省略した場合、デフォルトは right です。 各値の意味は以下の通りです:
- over
- 横書き組版モードでは、テキストの上に記号を描画します。
- under
- 横書き組版モードでは、テキストの下に記号を描画します。
- right
- 縦書き組版モードでは、テキストの右側に記号を描画します。
- left
- 縦書き組版モードでは、テキストの左側に記号を描画します。
強調記号は、各文字がその記号をルビ注記テキストとして割り当てられ、 ルビ位置がtext-emphasis-positionで指定され、ルビ揃えが中央であるかのように 正確に描画されます。 この位置は下線や上線装飾と衝突する場合、調整されることがあります。
強調記号による行の高さへの影響は、ルビテキストの場合と同じです。
言語 | 推奨位置 | 図例 | ||
---|---|---|---|---|
横書き | 縦書き | |||
日本語 | over | right | ![]() | ![]() |
韓国語 | ||||
モンゴル語 | ||||
中国語 | under | right | ![]() |
強調記号が、ルビが同じ位置に描画される文字に適用された場合、 強調記号はルビの外側に配置されます。 これは自動非表示および空のルビ注記も含みます。

強調記号が4文字に適用され、うち2文字にはルビも付与された例
ruby { text-emphasis: none; }
逆に、強調記号と衝突する場合、ルビを非表示にする編集者もいます。 HTMLでは次のパターンで実現できます:
em { text-emphasis: dot; } /* <em>要素にtext-emphasisを設定 */ em rt { display: none; } /* <em>要素内のルビを非表示 */
4. テキストシャドウ:text-shadow プロパティ
名前: | text-shadow |
---|---|
値: | none | [ <color>? && <length>{2,3} ]# |
初期値: | none |
適用対象: | テキスト |
継承: | はい |
パーセンテージ: | 該当なし |
算出値: | キーワード none または 各アイテムが3つの絶対長さ+計算された色からなるリスト |
正規順序: | 文法通り |
アニメーション型: | シャドウリストとして |
このプロパティは要素のテキストに適用するシャドウ効果のカンマ区切りリストを受け付けます。 値の解釈は box-shadow [CSS-BACKGROUNDS-3] と同じです。 (ただし spread値や inset キーワードは使用できません。) 各レイヤーは要素のテキストとそのすべてのテキスト装飾(合成されたもの)にシャドウをかけます。
シャドウ効果は前面から背面の順に適用されます: 最初のシャドウが一番上です。 シャドウ同士は重なりますが、テキスト自体には重なりません。 シャドウは要素のborder・background(存在する場合)よりも積み重ね順が高く、 テキストおよびテキスト装飾よりも低い位置で描画されます。 UAは、同じ積層レベル・スタッキングコンテキスト内の隣接要素のテキスト上にシャドウを描画しないよう配慮すべきです。 (つまり、シャドウの積層レベルはborderやbackgroundがあるかどうかで変化する場合があり、 テキストシャドウの積層挙動はUA定義です。) あるシャドウレイヤーが各グリフや装飾を個別にシャドウするか、 テキストや装飾を一度合成してからシャドウするかは未定義です。
box-shadowと異なり、テキストシャドウはシャドウ対象形状にクリップされず、 テキストが部分的に半透明の場合はシャドウが透けて見えることがあります。 box-shadowと同様に、テキストシャドウはレイアウトに影響せず、 スクロールの発生やスクロール可能なオーバーフロー領域のサイズ増加を引き起こしません。
注意: ここで定義されるシャドウの描画順は 1998年のCSS2勧告で定義された順序の逆です。
text-shadowプロパティは::first-line
および ::first-letter
疑似要素にも適用されます。
5. テキスト装飾の描画
5.1. テキスト装飾の描画順
[CSS2]と同様に、テキスト装飾は装飾対象のテキストの直上/直下に、以下の順序(最下層から)で描画されます:
- シャドウ(text-shadow)
- 下線(text-decoration)
- 上線(text-decoration)
- テキスト
- 強調記号(text-emphasis)
- 取り消し線(text-decoration)
線装飾がボックス装飾やアトミックインラインを横断して描画される場合、 非配置コンテンツの上、および配置された子孫のすぐ下(CSS2.1付録Eのレイヤー#8直下)で描画されます。
5.2. テキスト装飾のオーバーフロー
テキスト装飾がボックスの外に漏れた場合、それはインクオーバーフローとみなされます。 スクロール可能なオーバーフロー領域を拡張しません。[css-overflow-3]
付録A: 謝辞
この仕様は以下の方々のご協力なくして実現しませんでした: Ayman Aldahleh、Bert Bos、Tantek Çelik、Stephen Deach、John Daggett、 Martin Dürst、 Laurie Anna Edlund、Ben Errez、Yaniv Feinberg、Arye Gittelman、Ian Hickson、Martin Heijdra、Richard Ishida、Masayasu Ishikawa、 Michael Jochimsen、Eric LeVine、Ambrose Li、Håkon Wium Lie、Chris Lilley、 Ken Lunde、Nat McCully、Shinyu Murakami、Paul Nelson、Chris Pratley、Marcin Sawicki、 Arnold Schrijver、Rahul Sonnad、Michel Suignard、Takao Suzuki、 Frank Tang、Chris Thrasher、Etan Wexler、Chris Wilson、Masafumi Yabe および Steve Zilles。
付録B: デフォルトUAスタイルシート
この付録は参考情報であり、UA開発者がデフォルトスタイルシートを実装する際の補助となるものですが、 UA開発者は自由に無視または変更することができます。
/* HTMLの代表的なスタイリング */
blink {
text-decoration-line: blink;
}
s, strike, del {
text-decoration: line-through;
}
u, ins, :link, :visited {
text-decoration: underline;
}
abbr[title], acronym[title] {
text-decoration: dotted underline;
}
/* ルビテキストへのtext-emphasis継承を無効化:
強調記号は基底テキストにのみ適用されるべき */
rt { text-emphasis: none; }
/* 言語ごとのデフォルト強調記号位置を設定 */
:root:lang(zh), [lang|=zh] { text-emphasis-position: under right; }
[lang|=ja], [lang|=ko] { text-emphasis-position: over right; }
/* 言語ごとのデフォルト下線位置を設定 */
:root:lang(ja), [lang|=ja],
:root:lang(mn), [lang|=mn],
:root:lang(ko), [lang|=ko] { text-underline-position: right; }
:root:lang(zh), [lang|=zh] { text-underline-position: left; }
/* 互換性の観点から、上記ではunderではなくautoが(暗黙で)選択されています */
もし問題や追加すべき提案、修正事項があれば、 www-style@w3.org宛に 件名に[css-text-decor]を含めて情報を送信してください。
@keyframes blink { 0% { visibility: hidden; animation-timing-function: step-end; } 25%, 100% { visibility: visible; } } blink { animation: blink 1s infinite; }
付録C: 変更点
2019年8月候補勧告以降の変更点
主な変更点:
- text-shadowがシャドウリストとして box-shadowと同様にアニメーションすることを明記。 (Issue 4375)
- テキストに適用されるプロパティについて明確化。 (Issue 5303)
- 細かな編集修正。
2018年7月候補勧告以降の変更点
主な変更点:
- テキスト装飾のオーバーフローがインクオーバーフローであることを明確化。 (Issue 3272)
- サンプルのtext-underline-positionルールの不整合修正。 (Issue 3441)
- 「算出値」行を新しい慣例に合わせて整理。
コメント処理状況も公開されています。
2013年8月候補勧告以降の主な変更点
主な重要な変更点:
- text-decoration-skipは大幅な変更を可能にするためレベル4に延期。 挙動のデフォルトは本文で定義。 (Issue 1, Issue 22, Issue 26)
- 取り消し線がインクスキップ機能の影響を受けないことを明記。 (Issue 24)
- インクがスキップされる場合、線端がグリフ形状に従うことを推奨。 (Issue 30)
- 書記方向に依存する条件を組版モードに依存するよう更新。 sideways-lrや sideways-rl値がwriting-modeプロパティに追加されたことに対応。 強調記号の向きをsideways-lr/sideways-rlでは未定義とした。 (Issue 10, Issue 20)
- text-emphasis-positionの [ right | left ]オプションを任意とし、 デフォルトをrightにした。 (Issue 17)
- text-underline-positionで left/rightのみ指定した場合はautoが暗黙指定されるよう変更。 (Issue 18)
- テキスト装飾が先頭・末尾の空白をスキップするよう変更。 (Issue 6)
- ルビ注記の位置がテキスト装飾と衝突する場合は調整されることに言及。 (Issue 21)
- text-shadowの初期値を
currentColor
に変更。 (Issue 28) - text-shadowの「算出値」行の誤り修正。 (Issue 7)
- text-shadow値の正規順序を実装と一致するよう修正。 (Issue 35)
-
強調記号が自動非表示・空のルビと関係する場合の位置決定を定義。
(Issue 9)
強調記号が、ルビが同じ位置に描画される文字に適用された場合、 強調記号はルビの外側に配置されます。 これには自動非表示および空のルビ注記も含みます。
- text-emphasisがデフォルトで句読点をスキップするように変更。 (Issue 16)
- 強調記号のフォントにrubyを適用するルール追加。 (Issue 13)
- text-emphasis-positionおよび text-underline-positionのデフォルトUAルールの修正・改善。 (Issue 11, Issue 12, Issue 18, Issue 19, Issue 36)