HTML要素辞書 by Sentaro

強調（Emphasis）要素。テキストの文脈上の強調（インポートな言葉）を示します。

info

概要

 要素は、その内容が周囲のテキストと比較して**文脈上の強調**を持つことを示します。これにより、ユーザーエージェント（ブラウザやスクリーンリーダーなど）は、そのテキストを強調してレンダリングしたり、発音したりすることができます。
通常、ブラウザでは**イタリック体**で表示されますが、これは見た目の装飾ではなく、セマンティクス（意味）を伝えるためのものです。

play_circle

デモ (静的表示)

HTML (Source)

魚を食べるなら、新鮮なものが一番だ。 私は絶対にそこには行かない。 絶対にだ。

Preview (Result)

魚を食べるなら、新鮮なものが一番だ。

私は絶対にそこには行かない。 絶対にだ。

list

属性 (Attributes)

属性名	説明
グローバル属性	全てのHTML要素で使用できる属性です。（例: id, class, style, title, langなど）

code

, , , の違い

強調の程度と意味の違い

<!-- <em> は文脈上の強調。読み上げる際のアクセントの変化など。 -->
<p>猫を飼うなら、<em>シャム猫</em>がいい。</p>

<!-- <strong> は重要性、深刻性、緊急性。 -->
<p>ご注文の前に、<strong>必ず</strong>利用規約をお読みください。</p>

<!-- <i> は別の視点、技術用語、思考など。（見た目の装飾ではない） -->
<p>その時、彼女は<i>もしや</i>と思った。</p>

<!-- <b> は特段の重要性なく、単に目立たせたい場合。（例: 記事のリード文） -->
<p>このゲームの主人公は<b>勇敢な騎士</b>です。</p>

lightbulb

知っておくべき重要事項

security

ネストされた 要素
 要素をネスト（入れ子）にすることで、強調の度合いを高めることができます。例えば、...非常に重要 のように使用されます。

accessibility_new

スクリーンリーダーへの影響
 要素は、スクリーンリーダーが読み上げる際に、強調を示すために音声のトーンやアクセントを変えることがあります。 や は通常、読み上げ方には影響しません。セマンティクスを意識して使い分けましょう。

私について利用規約プライバシーポリシー

概要

デモ (静的表示)

属性 (Attributes)

<em>, <strong>, <i>, <b> の違い

知っておくべき重要事項