適用 (対象)
CSS
これは、次の達成基準に関する達成方法である:
- 達成基準 1.4.4: テキストのサイズ変更 (書かれていない達成方法を満たす手段として十分)
- 達成基準 1.4.5: 文字画像 (参考)
- 達成基準 1.4.8: 視覚的提示 (G146: リキッドレイアウトを使用するの達成方法として十分)
- 達成基準 1.4.9: 文字画像 (例外なし) (参考)
解説
この達成方法の目的は、設定したい相対的なフォントサイズを表現するキーワードでフォントサイズを指定することである。これらの値は、ユーザエージェントが継承されたフォントサイズに相対的なフォントサイズを選択できるようにヒントを提供する。
事例
例 1: CSS でのキーワードによるフォントサイズ指定
この事例では、どのような設定であっても、strong 要素のテキストが周りのテキストよりも常に大きく表示されるように、「larger」というフォントサイズが指定してある。親要素である見出しやパラグラフにフォントサイズが指定されていても、strong 要素でマークアップされた強調語は、周りのテキストよりも大きく表示されるだろう。
訳注
MDN の strong 要素で示されているように、古い HTML では strong 要素を単により強い強調としていたが、現在の HTML では strong を重要性を表すものと定義している。
strong {font-size: larger}
...
<h1>Letting the <strong>user</strong> control text size</h1>
<p>Since only the user can know what size text works for him,
it is <strong>very</strong> important to let him configure the text size.
…参考リソース
参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
訳注
フォントに関する CSS の仕様は、CSS Fonts Module Level 3 を参照のこと。この仕様が、CSS 2 のフォントに関する記述に取って代わることに注意されたい。CSS Snapshot 2020 も参照のこと。
検証
手順
- フォントサイズを定義する CSS プロパティの値が、xx-small、x-small、small、medium、large、x-large、xx-large、smaller、larger の中のどれか一つであることを確認する。
期待される結果
- #1 の結果が真である。