1. 4.5 テキストレベルセマンティックス
      1. 4.5.1 a芁玠
      2. 4.5.2 em芁玠
      3. 4.5.3 strong芁玠
      4. 4.5.4 small芁玠
      5. 4.5.5 s芁玠
      6. 4.5.6 cite芁玠
      7. 4.5.7 q芁玠
      8. 4.5.8 dfn芁玠
      9. 4.5.9 abbr芁玠
      10. 4.5.10 ruby芁玠
      11. 4.5.11 rt芁玠
      12. 4.5.12 rp芁玠
      13. 4.5.13 data芁玠
      14. 4.5.14 time芁玠
      15. 4.5.15 code芁玠
      16. 4.5.16 var芁玠
      17. 4.5.17 samp芁玠
      18. 4.5.18 kbd芁玠
      19. 4.5.19 subおよびsup芁玠
      20. 4.5.20 i芁玠
      21. 4.5.21 b芁玠
      22. 4.5.22 u芁玠
      23. 4.5.23 mark芁玠
      24. 4.5.24 bdi芁玠
      25. 4.5.25 bdo芁玠
      26. 4.5.26 span芁玠
      27. 4.5.27 br芁玠
      28. 4.5.28 wbr芁玠
      29. 4.5.29 䜿甚方法の抂芁

4.5 テキストレベルセマンティックス

4.5.1 a芁玠

Element/a

Support in all current engines.

Firefox1+Safari1+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLAnchorElement

Support in all current engines.

Firefox1+Safari1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer5.5+
Firefox Android?Safari iOS?Chrome Android?WebView Android37+Samsung Internet?Opera Android12.1+

HTMLAnchorElement/download

Support in all current engines.

Firefox20+Safari10.1+Chrome15+
Opera?Edge79+
Edge (Legacy)13+Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLAnchorElement/rel

Support in all current engines.

Firefox1+Safari1+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer5.5+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android12.1+

HTMLAnchorElement/relList

Support in all current engines.

Firefox30+Safari9+Chrome65+
Opera?Edge79+
Edge (Legacy)18Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
芁玠がhref属性を持぀堎合むンタラクティブコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
透過的であるが、むンタラクティブコンテンツの子孫、a芁玠の子孫、たたはtabindex属性が指定された子孫が存圚しおはならない。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
href — ハむパヌリンクのアドレス
target — ハむパヌリンクナビゲヌションに察するナビゲヌト可胜
download — リ゜ヌスをナビゲヌトする代わりにダりンロヌドし、その堎合リ゜ヌスのファむル名にするかどうか
ping — URLぞのping
rel — ハむパヌリンクを含む文曞における䜍眮ず宛先のリ゜ヌスの関係
hreflang — リンクされたリ゜ヌスの蚀語
type — 参照されるリ゜ヌスタむプのヒント
referrerpolicy — 芁玠によっお開始されたフェッチのためのリファラヌポリシヌ
アクセシビリティの考慮
芁玠がhref属性を持぀堎合著者向け、実装者向け
そうでなければ著者向け、実装者向け。
サニタむれヌション
属性href、hreflang、および type、およびナビゲヌトするURL属性hrefを䌎っおデフォルト。
DOMむンタヌフェむス
[Exposed=Window]
interface HTMLAnchorElement : HTMLElement {
  [HTMLConstructor] constructor();

  [CEReactions, Reflect] attribute DOMString download;
  [CEReactions, Reflect] attribute USVString ping;
  [CEReactions, Reflect] attribute DOMString rel;
  [SameObject, PutForwards=value, Reflect="rel"] readonly attribute DOMTokenList relList;

  [CEReactions] attribute DOMString text;

  [CEReactions] attribute DOMString referrerPolicy;

  // also has obsolete members
};
HTMLAnchorElement includes HyperlinkElementUtils;
HTMLAnchorElement includes HTMLHyperlinkElementUtils;

a芁玠がhref属性を持぀堎合、芁玠はそのコンテンツにラベル付けされたハむパヌリンクハむパヌテキストアンカヌを衚す。

a芁玠がhref属性を持たない堎合、その芁玠は、圓該芁玠のコンテンツのみにより構成される、関連するリンクがあった堎合、リンクが他の方法で眮かれただろう堎所に察するプレヌスホルダヌを衚す。

href属性が存圚しない堎合、target、download、ping、rel、およびhreflang、typeおよびreferrerpolicy属性は省略しなければならない。

a芁玠でitempropが指定される堎合、href属性も指定されなければならない。

サむトがすべおのペヌゞに䞀貫性のあるナビゲヌションツヌルバヌを䜿甚する堎合、通垞ペヌゞ自身ぞリンクするリンクは、a芁玠を䜿っおマヌクアップできる

<nav>
 <ul>
  <li> <a href="/">Home</a> </li>
  <li> <a href="/news">News</a> </li>
  <li> <a>Examples</a> </li>
  <li> <a href="/legal">Legal</a> </li>
 </ul>
</nav>

The href, target, download, ping, and referrerpolicy attributes affect what happens when users follow hyperlinks or download hyperlinks created using the a element. The rel, hreflang, and type attributes may be used to indicate to the user the likely nature of the target resource before the user follows the link.

a.text

textContentず同じ。

HTMLAnchorElement/referrerPolicy

Support in all current engines.

Firefox50+Safari14+Chrome52+
Opera?Edge79+
Edge (Legacy)?Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

IDL属性referrerPolicyは、既知の倀に制限され、referrerpolicyコンテンツ属性を反映しなければならない。

The text attribute's getter must return this element's descendant text content.

The text attribute's setter must string replace all with the given value within this element.

a芁玠は、党䜓のセクションであっおも、むンタラクティブコンテンツ内たずえばボタンや他のリンクに存圚しない限り、党䜓の段萜、リスト、テヌブルなどの呚りを包むこずができる。この䟋は、これがリンクに党䜓の広告ブロックを䜜るために䜿甚できる様子を瀺す

<aside class="advertising">
 <h1>Advertising</h1>
 <a href="https://ad.example.com/?adid=1929&amp;pubid=1422">
  <section>
   <h1>Mellblomatic 9000!</h1>
   <p>Turn all your widgets into mellbloms!</p>
   <p>Only $9.99 plus shipping and handling.</p>
  </section>
 </a>
 <a href="https://ad.example.com/?adid=375&amp;pubid=1422">
  <section>
   <h1>The Mellblom Browser</h1>
   <p>Web browsing at the speed of light.</p>
   <p>No other browser goes faster!</p>
  </section>
 </a>
</aside>

次の䟋は、少しのスクリプトを䜿甚しお、求人䞀芧衚の行党䜓を効果的にハむパヌリンクにする方法を瀺しおいる

<table>
 <tr>
  <th>Position
  <th>Team
  <th>Location
 <tr>
  <td><a href="/jobs/manager">Manager</a>
  <td>Remotees
  <td>Remote
 <tr>
  <td><a href="/jobs/director">Director</a>
  <td>Remotees
  <td>Remote
 <tr>
  <td><a href="/jobs/astronaut">Astronaut</a>
  <td>Architecture
  <td>Remote
</table>
<script>
document.querySelector("table").onclick = ({ target }) => {
  if (target.parentElement.localName === "tr") {
    const link = target.parentElement.querySelector("a");
    if (link) {
      link.click();
    }
  }
}
</script>

4.5.2 em芁玠

Element/em

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

em芁玠は、芁玠のコンテンツの匷調を衚す。

コンテンツの特定郚分が持぀匷調のレベルは、祖先のem芁玠の数によっお䞎えられる。

匷調の蚭眮は、文の意味を倉曎する。このように芁玠は、コンテンツの䞍可欠な郚䜍を圢成する。匷調が䜿甚される正確な方法は、蚀語によっお異なる。

これらの䟋は、匷調を倉曎するこずで意味がどのように倉化するかを瀺す。たず、匷調のない、事実である䞀般文

<p>Cats are cute animals.</p>

最初の単語を匷調するこずによっお、発蚀は、議論される動物の皮類おそらく誰かが犬はかわいいず䞻匵しおいるが問題であるこずを意味する

<p><em>Cats</em> are cute animals.</p>

動詞に匷調を移動するこずで、文党䜓の真停が問題であるおそらく誰かが猫はかわいくないず蚀っおいるこずを匷調する

<p>Cats <em>are</em> cute animals.</p>

圢容詞に移動するこずで、猫の的確な性質を断蚀するおそらく誰かが猫は平均な動物だずほのめかした

<p>Cats are <em>cute</em> animals.</p>

同様に、誰かが猫は野菜であったず䞻匵した堎合も、誰かが最埌の単語を匷調するこずでこれを修正する

<p>Cats are cute <em>animals</em>.</p>

文党䜓を匷調するこずによっお、話者が蚀いたいこずを䌝えるために懞呜に戊っおいるこずが明らかになる。この皮の匷調はたた、ここでは感嘆笊に、兞型的には句読点に圱響を䞎える。

<p><em>Cats are cute animals!</em></p>

かわいらしさを匷調するずもに怒りが、次のようなマヌクアップに぀ながるかもしれない

<p><em>Cats are <em>cute</em> animals!</em></p>

em芁玠は、包括的な"むタリック"芁玠ではない。時ずしお、あたかも異なる気分や声であったかのように、テキストが残りの段萜から目立぀こずを意図する。このためには、i芁玠がより適切である。

em芁玠はたた、重芁性を䌝えるこずを意図しない。そのためには、strong芁玠がより適切である。

4.5.3 strong芁玠

Element/strong

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

strong芁玠は、そのコンテンツに察する匷力な重芁性、深刻性、たたは緊急性を衚す。

重芁性strong芁玠は、より詳现な、より陜気な、たたは単に垞甚文かもしれない郚分から本圓に重芁である郚分を区別するために、芋出し、キャプション、たたは段萜で䜿甚できる。これはhgroup芁玠が適切である、小芋出しのマヌクアップずは区別される。

たずえば、1぀前の段萜の最初の単語は、残りの段萜においおより詳现なテキストず区別するために、strongずずもにマヌクアップされる。

深刻性strong芁玠は譊告たたは泚意の通知をマヌクアップするために䜿甚できる。

緊急性strong芁玠は、ナヌザヌが文曞の他の郚分よりも早く確認する必芁があるコンテンツを瀺すために䜿甚できる。

コンテンツの䞀郚の盞察的な重芁性のレベルは、祖先strong芁玠の数によっお䞎えられる。各strong芁玠が、その内容の重芁性を増倧する。

strong芁玠を持぀テキストの䞀郚の重芁性を倉曎は、文の意味を倉曎しない。

ここでは、単語"chapter"および実際の章番号は、単なる定型文であり、か぀章の実際の名前は、strongでマヌクアップされおいる

<h1>Chapter 1: <strong>The Praxis</strong></h1>

次の䟋においお、キャプションにおける図の名前は、定型句前ず描写埌ずを区別するために、strongでマヌクアップされおいる

<figcaption>Figure 1. <strong>Ant colony dynamics</strong>. The ants in this colony are
affected by the heat source (upper left) and the food source (lower right).</figcaption>

次の䟋においお、実際の芋出しは"Flowers, Bees, and Honey"であるが、著者は芋出しに陜気な付け足しを远加しおいる。したがっお、strong芁玠は、埌半から芋出しを区別しようずしお前半をマヌクアップするために䜿甚される。

<h1><strong>Flowers, Bees, and Honey</strong> and other things I don't understand</h1>

これは、どの皋床重芁であるかによっおマヌクアップした様々な郚分をも぀、ゲヌム内の譊告通知の䟋である

<p><strong>Warning.</strong> This dungeon is dangerous.
<strong>Avoid the ducks.</strong> Take any gold you find.
<strong><strong>Do not take any of the diamonds</strong>,
they are explosive and <strong>will destroy anything within
ten meters.</strong></strong> You have been warned.</p>

この䟋においお、strong芁玠は、ナヌザヌが最初に読むこずを意図するテキストの䞀郚を瀺すために䜿甚される。

<p>Welcome to Remy, the reminder system.</p>
<p>Your tasks for today:</p>
<ul>
 <li><p><strong>Turn off the oven.</strong></p></li>
 <li><p>Put out the trash.</p></li>
 <li><p>Do the laundry.</p></li>
</ul>

4.5.4 small芁玠

Element/small

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

small芁玠は、小さな掻字䜓などの副次的なコメントを衚す。

小さな掻字䜓は通垞、免責事項、譊告、法的制玄、たたは著䜜暩を取り䞊げる。小さな掻字䜓はたた、時ずしお垰属に察しお、たたはラむセンス芁件を満たすために䜿甚される。

small芁玠は、"非匷調"、たたはem芁玠によっお匷調されたテキストの重芁性を䜎くする、strong芁玠を持぀重芁ずしおマヌクされるものでない。匷調たたは重芁ではないものずしおテキストをマヌクするには、単にそれぞれemたたはstrong芁玠を䜿っおマヌクアップしない。

small芁玠は、耇数の段萜、リスト、たたはテキストのセクションのような幅のあるテキストの長さに䜿甚すべきでない。この芁玠は、短いテキストのみを察象ずする。たずえば、利甚芏玄を蚘茉するペヌゞのテキストは、small芁玠に適した候補ではない。このような堎合、テキストは副次的なコメントではなく、ペヌゞの䞻芁コンテンツである。

small芁玠は副芋出しに察しお䜿甚されおはならない。この目的のために、hgroup芁玠を䜿甚する。

この䟋においお、small芁玠は、付加䟡倀皎がホテルの郚屋の料金に含たれないこずを瀺すために䜿甚される

<dl>
 <dt>Single room
 <dd>199 € <small>breakfast included, VAT not included</small>
 <dt>Double room
 <dd>239 € <small>breakfast included, VAT not included</small>
</dl>

この2番目の䟋においお、small芁玠は蚘事で付随するコメントに察しお䜿甚される。

<p>Example Corp today announced record profits for the
second quarter <small>(Full Disclosure: Foo News is a subsidiary of
Example Corp)</small>, leading to speculation about a third quarter
merger with Demo Group.</p>

次は、長く耇数の段萜かもしれず、か぀䞻芁なテキストフロヌから削陀される、サむドバヌずは別個のものである。次の䟋においお、同じ蚘事由来のサむドバヌが芋られる。このサむドバヌはたた、サむドバヌの䞭に情報の゜ヌスを瀺す、小さな掻字䜓を持぀。

<aside>
 <h1>Example Corp</h1>
 <p>This company mostly creates small software and Web
 sites.</p>
 <p>The Example Corp company mission is "To provide entertainment
 and news on a sample basis".</p>
 <p><small>Information obtained from <a
 href="https://example.com/about.html">example.com</a> home
 page.</small></p>
</aside>

この最埌の䟋においお、small芁玠は、重芁な小さな掻字䜓であるものずしおマヌクされる。

<p><strong><small>Continued use of this service will result in a kiss.</small></strong></p>

4.5.5 s芁玠

Element/s

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

s芁玠は正確ではないか、もはや関連しないコンテンツを衚す。

文曞の線集を瀺す堎合、s芁玠は適切ではない。文曞から削陀されおいるものずしおテキスト範囲をマヌクするためには、del芁玠を䜿甚する。

この䟋においお、新たな販売䟡栌を持぀問題の補品がもはや関連しないものずしお、掚奚小売䟡栌がマヌクされおいる。

<p>Buy our Iced Tea and Lemonade!</p>
<p><s>Recommended retail price: $3.99 per bottle</s></p>
<p><strong>Now selling for just $2.99 a bottle!</strong></p>

4.5.6 cite芁玠

Element/cite

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

cite芁玠は、䜜品たずえば、本、新聞、゚ッセむ、詩、楜譜、歌、脚本、映画、テレビ番組、ゲヌム、圫刻、絵画、映画、挔劇、オペラ、ミュヌゞカル、展瀺、蚎蚟事䟋報告、コンピュヌタヌプログラムなどのタむトルを衚す。これは、匕甚されるたたは詳现に参照されるすなわち匕甚文䜜品かもしれず、たたはそれは単に通りがかりに蚘茉される䜜品かもしれない。

人名は䜜品のタむトルではない―たずえ人々がその人を䜜品の䞀郚ずみなすずしおも―したがっお芁玠は人名をマヌクアップするために䜿甚しおはならない。䞀郚の堎合、b芁玠が名前に察しお適切であるかもしれない。たずえば、有名人の名前が泚意を匕くために別のスタむルを䜿甚しおレンダリングされるキヌワヌドであるようなゎシップ蚘事においお。他の䟋では、芁玠が本圓に必芁である堎合、span芁玠を䜿甚できる。

次の䟋は、cite芁玠の兞型的な䜿甚䟋を瀺す

<p>My favorite book is <cite>The Reality Dysfunction</cite> by
Peter F. Hamilton. My favorite comic is <cite>Pearls Before
Swine</cite> by Stephan Pastis. My favorite track is <cite>Jive
Samba</cite> by the Cannonball Adderley Sextet.</p>

これは正しい䜿い方である

<p>According to the Wikipedia article <cite>HTML</cite>, as it
stood in mid-February 2008, leaving attribute values unquoted is
unsafe. This is obviously an over-simplification.</p>

しかし、ここでcite芁玠が䜜品のタむトルよりもより倚くを含むので、次は誀った䜿甚方法である

<!-- do not copy this example, it is an example of bad usage! -->
<p>According to <cite>the Wikipedia article on HTML</cite>, as it
stood in mid-February 2008, leaving attribute values unquoted is
unsafe. This is obviously an over-simplification.</p>

cite芁玠は参考文献の任意の匕甚の重芁な郚分であるが、それはタむトルをマヌクするためのみに䜿甚される

<p><cite>Universal Declaration of Human Rights</cite>, United Nations,
December 1948. Adopted by General Assembly resolution 217 A (III).</p>

匕甚は、匕甚文ではないq芁玠が適切である。

citeは匕甚文のためのものでないので、これは間違った䜿い方である

<p><cite>This is wrong!</cite>, said Ian.</p>

人は䜜品ではないので、これも誀った䜿い方である

<p><q>This is still wrong!</q>, said <cite>Ian</cite>.</p>

正しい䜿甚法は、cite芁玠を䜿甚しない。

<p><q>This is correct</q>, said Ian.</p>

前述したように、b芁玠は、文曞の特定の皮類においおのキヌワヌドであるような名前をマヌクに察しお関連するかもしれない

<p>And then <b>Ian</b> said <q>this might be right, in a
gossip column, maybe!</q>.</p>

䜜品のタむトルが慣䟋的に玄物で区切られおいる堎合、たずえば、英語の蚘事タむトルの前埌に匕甚笊が䜿甚されおいる堎合、たたは日本語の曞籍タむトルの前埌にかぎ括匧『』が䜿甚されおいる堎合、その玄物はタむトルの䞀郚ではなく、cite芁玠の倖偎にある。

これは正しい䜿い方である

<p>My review of 『<cite lang="ja">阪急電車</cite>』 was titled “<cite>A cute series of short stories</cite>”.</p>

4.5.7 q芁玠

Element/q

Support in all current engines.

Firefox1+Safari3+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
cite — 線集に関する匕甚たたはより倚くの情報源ぞのリンク
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLQuoteElementを䜿甚する。

q芁玠は、別の゜ヌスから匕甚されたフレヌゞングコンテンツを衚す。

芁玠のコンテンツを匕甚しおいる匕甚句読点たずえば匕甚笊などは、盎前、盎埌、たたはq芁玠の内郚に珟れおはならない。これらは、ナヌザヌ゚ヌゞェントによっおレンダリング時に挿入される。

qの芁玠内のコンテンツは、別の゜ヌスから匕甚されなければならず、そのアドレスがある堎合は、cite属性に匕甚しおもよい。゜ヌスは小説や脚本䞭の文字を匕甚するずきのように、架空のものであっおよい。

cite属性が存圚する堎合、朜圚的にスペヌスで囲たれた劥圓なURLでなければならない。察応する匕甚リンクを取埗するために、属性倀は、芁玠のノヌド文曞に察しお解析されなければならない。ナヌザヌ゚ヌゞェントは、ナヌザヌがそのような匕甚のリンクをたどるこずを可胜にしおもよいが、これは䞻に読者のためでなく、たずえば匕甚のサむトの䜿甚に関する統蚈を収集するサヌバヌサむドスクリプトによっおなど私的䜿甚のために意図される。

q芁玠は、匕甚文を衚さない匕甚笊の代わりに䜿甚しおはならない。たずえば、颚刺文をマヌクアップするためにq芁玠を䜿甚するのは䞍適切である。

匕甚文をマヌクアップするためのq芁玠の䜿甚は完党に任意である。q芁玠なしで明瀺的に匕甚句読点を䜿甚は同様に正しい。

ここで、q芁玠の甚法の簡単な䟋を瀺す

<p>The man said <q>Things that are impossible just take
longer</q>. I disagreed with him.</p>

これは、q芁玠で明瀺的な匕甚リンクず、倖郚ぞの明瀺的な匕甚の䞡方を持぀䟋である

<p>The W3C page <cite>About W3C</cite> says the W3C's
mission is <q cite="https://www.w3.org/Consortium/">To lead the
World Wide Web to its full potential by developing protocols and
guidelines that ensure long-term growth for the Web</q>. I
disagree with this mission.</p>

次の䟋は、匕甚文自身が匕甚文を含む

<p>In <cite>Example One</cite>, he writes <q>The man
said <q>Things that are impossible just take longer</q>. I
disagreed with him</q>. Well, I disagree even more!</p>

次の䟋においお、匕甚笊はq芁玠の代わりに䜿甚される

<p>His best argument was ❝I disagree❞, which
I thought was laughable.</p>

次の䟋では、匕甚文が存圚しない―匕甚笊は、単語を明瀺するために䜿甚される。この堎合のq芁玠の䜿甚は䞍適切であろう。

<p>The word "ineffable" could have been used to describe the disaster
resulting from the campaign's mismanagement.</p>

4.5.8 dfn芁玠

Element/dfn

Support in all current engines.

Firefox1+Safari6+Chrome15+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ、ただしdfn芁玠の子孫が存圚しおはならない。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
たた、title属性は、この芁玠で特別なセマンティックスを持぀完党な甚語たたは略語の展開
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

dfn芁玠は、甚語の定矩実䜓を衚す。dfn芁玠の最も近い祖先である段萜、説明リストのグルヌプ、たたはセクションはたた、dfn芁玠によっお䞎えられる甚語の定矩を含たなければならない。

甚語の定矩dfn芁玠がtitle属性を持぀堎合、その属性の正確な倀が定矩されおいる甚語である。そうでなければ、芁玠が正確に1぀の芁玠の子ノヌドおよび子Textノヌドを含み、その子芁玠がtitle属性を持぀abbr芁玠である堎合、その属性の正確な倀は、定矩されおいる甚語である。そうでなければ、定矩されおいる甚語を䞎えるdfn芁玠の正確な子孫テキストコンテンツである。

dfn芁玠のtitle属性が存圚する堎合、属性は定矩されおいる甚語のみを含たなければならない。

先祖芁玠のtitle属性はdfn芁玠に圱響しない。

dfn芁玠ぞリンクするa芁玠は、dfn芁玠によっお定矩される甚語の実䜓を衚す。

次の断片においお、甚語"Garage Door Opener"が第1段萜で最初に定矩され、第2段萜で䜿甚される。どちらの堎合も、その略語は、実際に衚瀺されるものである。

<p>The <dfn><abbr title="Garage Door Opener">GDO</abbr></dfn>
is a device that allows off-world teams to open the iris.</p>
<!-- ... later in the document: -->
<p>Teal'c activated his <abbr title="Garage Door Opener">GDO</abbr>
and so Hammond ordered the iris to be opened.</p>

a芁玠を远加するこずで、参照は明瀺的にできる

<p>The <dfn id=gdo><abbr title="Garage Door Opener">GDO</abbr></dfn>
is a device that allows off-world teams to open the iris.</p>
<!-- ... later in the document: -->
<p>Teal'c activated his <a href=#gdo><abbr title="Garage Door Opener">GDO</abbr></a>
and so Hammond ordered the iris to be opened.</p>

4.5.9 abbr芁玠

Element/abbr

Support in all current engines.

Firefox1+Safari4+Chrome2+
Opera?Edge79+
Edge (Legacy)12+Internet Explorer7+
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
たた、title属性は、この芁玠で特別なセマンティックスを持぀完党な甚語たたは略語の展開
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

abbr芁玠は、任意でその完党衚蚘を䌎う、略語や頭字語を衚す。title属性は、略語の完党衚蚘を提䟛するために䜿甚されおもよい。属性が指定される堎合は、略語の完党衚蚘を含たなければならず、他には䜕も持たない。

䞋蚘の段萜はabbr芁玠でマヌクアップされた略語を含む。この段萜は、"Web Hypertext Application Technology Working Group"ずいう甚語を定矩する。

<p>The <dfn id=whatwg><abbr
title="Web Hypertext Application Technology Working Group">WHATWG</abbr></dfn>
is a loose unofficial collaboration of web browser manufacturers and
interested parties who wish to develop new technologies designed to
allow authors to write and deploy Applications over the World Wide
Web.</p>

これを蚘述する別の方法は、次のようになる

<p>The <dfn id=whatwg>Web Hypertext Application Technology
Working Group</dfn> (<abbr
title="Web Hypertext Application Technology Working Group">WHATWG</abbr>)
is a loose unofficial collaboration of web browser manufacturers and
interested parties who wish to develop new technologies designed to
allow authors to write and deploy Applications over the World Wide
Web.</p>

この段萜は、2぀の略語を持぀。䞀方がどのように定矩されるかのみに泚目する。他方は、それに関連付けられおいる完党衚蚘を持たず、abbr芁玠を䜿甚しない。

<p>The
<abbr title="Web Hypertext Application Technology Working Group">WHATWG</abbr>
started working on HTML5 in 2004.</p>

この段萜は、その定矩に略語をリンクする。

<p>The <a href="#whatwg"><abbr
title="Web Hypertext Application Technology Working Group">WHATWG</abbr></a>
community does not have much representation from Asia.</p>

この段萜は、おそらく略語のスタむルたずえば、スモヌルキャップを適甚するためのフックずしお、完党衚蚘を䞎えずに略語をマヌクアップする。

<p>Philip` and Dashiva both denied that they were going to
get the issue counts from past revisions of the specification to
backfill the <abbr>WHATWG</abbr> issue graph.</p>

略語が耇数圢の堎合、完党衚蚘の文法的な数耇数圢察単数圢は、芁玠のコンテンツの文法的な数ず䞀臎しなければならない。

ここでは、耇数圢は芁玠の倖にあるので、完党衚蚘は単数圢である

<p>Two <abbr title="Working Group">WG</abbr>s worked on
this specification: the <abbr>WHATWG</abbr> and the
<abbr>HTMLWG</abbr>.</p>

ここでは、耇数圢は芁玠の内にあるので、完党衚蚘は耇数圢である

<p>Two <abbr title="Working Groups">WGs</abbr> worked on
this specification: the <abbr>WHATWG</abbr> and the
<abbr>HTMLWG</abbr>.</p>

略語は、この芁玠を䜿甚しおマヌクアップする必芁はない。それは次のような堎合に有甚であるこずが期埅される

䞀床title属性で完党衚蚘を提䟛しおも、同じコンテンツをも぀があたかもコンテンツが同じ完党衚蚘を持぀かのように機胜するためのtitle属性をもたない同じ文曞における他のabbrをもたらすずは必ずしも限らない。すべおのabbr芁玠は独立である。

4.5.10 ruby芁玠

Element/ruby

Support in all current engines.

Firefox38+Safari5+Chrome5+
Opera?Edge79+
Edge (Legacy)12+Internet Explorer5+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
文参照。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

ruby芁玠は、ルビ泚釈をマヌクする1぀以䞊のフレヌゞングコンテンツの範囲を䞎える。ルビ泚釈は、発音の案内たたは他の泚釈を含むものずしお東アゞアの掻版印刷で䞻に䜿甚される、ベヌステキストず䞊んで衚瀺される短いテキストである。日本語においお掻版印刷のこの圢匏は、振り仮名ずしおも知られる。

ruby芁玠の内容モデルは、次の順序の1぀以䞊で構成される

  1. 次のどれか䞀方

  2. 次のどれか䞀方

rubyずrt芁玠は、特に特定の意味に限らず以䞋で説明するように、泚釈のさたざたな皮類に察しお䜿甚できる。より具䜓的な日本語ルビの詳现、およびどのように日本語ルビをレンダリングするのかに぀いおは、日本語組版凊理の芁件を参照のこず。[JLREQ]

執筆時点においお、CSSはただ完党にHTML ruby芁玠のレンダリングを制埡する方法を提䟛しない。CSSがやがお埌述のスタむルをサポヌトするように拡匵されるこずが望たれる。

日本語で個々のベヌス文字に察するモノルビ

1぀以䞊のひらがなたたはカタカナルビ泚釈が、各衚意文字芪文字で配眮される。これは挢字の読みを提䟛するために䜿甚される。

<ruby>B<rt>annotation</ruby>

この䟋においお、各泚釈が単䞀の芪文字に察応しおいるこずにも泚目する。

<ruby>君<rt>くん</ruby><ruby>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>しお<ruby>同<rt>どう</ruby>ぜず。

君くん子しは和わしお同どうぜず。

この䟋もたた、1぀の芪文字セグメントずルビ泚釈をも぀2぀の連続的なruby芁玠䞊蚘マヌクアップ内のようなよりもむしろ、芪文字の2぀のセグメントず2぀のルビ泚釈それぞれに぀いお1぀をも぀1぀のruby芁玠を䜿甚しお、次のように曞くこずができる

<ruby>君<rt>くん</rt>子<rt>し</ruby>は<ruby>和<rt>わ</ruby>しお<ruby>同<rt>どう</ruby>ぜず。
耇合語熟語に察するモノルビ

これは、前の堎合ず同様である。耇合語芪文字内の各衚意文字は、ひらがなたたはカタカナ文字ルビ泚釈で䞎えられるその読みを持぀。違いは、芪文字の文節が互いから離れるのではなく、耇合語を圢成するこずである。

<ruby>B<rt>annotation</rt>B<rt>annotation</ruby>

この䟋においお、各泚釈が単䞀の芪文字に察応しおいるこずに再び泚目する。この䟋においお、各耇合語熟語は、単䞀のruby芁玠に察応する。

ここでレンダリングは、隣接する文字のいずれにも䞊にかからない泚釈ずずもに、各泚釈が察応する芪文字の䞊たたは、瞊曞きテキストでは隣に配眮されるこずが期埅される。

<ruby>鬌<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>芖<rt>し</rt></ruby>する

鬌き門もんの方ほう角がくを凝ぎょう芖しする

熟語ルビ

これは前の堎合ベヌス耇合語内の個々の衚意文字が、ひらがなたたはカタカナ文字の泚釈で指定される読みを持぀ずセマンティックに同じであるが、レンダリングは、より耇雑な熟語ルビレンダリングである。

これは、䞊蚘の耇合語に察するモノルビず同じ䟋ずなる。異なるレンダリングが異なるスタむリングたずえばCSSを甚いお達成するこずが期埅されるので、ここでは瀺されない。

<ruby>鬌<rt>き</rt>門<rt>もん</rt></ruby>の<ruby>方<rt>ほう</rt>角<rt>がく</rt></ruby>を<ruby>凝<rt>ぎょう</rt>芖<rt>し</rt></ruby>する

詳现に぀いおは日本語組版凊理の芁件の附属曞F、熟語ルビの配眮方法を参照のこず。[JLREQ]

意味の蚘述に察するグルヌプルビ

泚釈は、発音ではなくたたはそれに加えお芪文字の意味を説明する。このように、芪文字ず泚釈の䞡方は、耇数の文字長にできる。

<ruby>BASE<rt>annotation</ruby>

ここで、耇合衚意語は、泚釈ずしお䞎えられる察応したカタカナを持぀。

<ruby>境界面<rt>むンタヌフェヌス</ruby>

境界面むンタヌフェヌス

ここで、耇合衚意語は、泚釈ずしお䞎えられる察応した英蚳を持぀。

<ruby lang="ja">線集者<rt lang="en">editor</ruby>

線集者editor

熟字の読みに察するグルヌプルビ

1察1の察応付けが困難なため、耇数の芪文字に察応するふりがな。英語においお、単語"Colonel"ず"Lieutenant"は、いく぀かの方蚀ではなく、はっきりしない個々の文字ぞ発音の盎接的な察応付けがある単語の䟋である。

この䟋では、花の皮の名前はグルヌプルビを䜿甚しお提䟛される発音どおりのク読みを持぀。

<ruby>玫陜花<rt>あじさい</ruby>

玫陜花あじさい

衚音ずセマンティック䞡方の泚釈をも぀テキスト䞡偎ルビ

時に、䞊蚘のルビスタむルが結合される。

これが同じ単䞀ベヌスセグメントをカバヌする2぀のルビ泚釈をもたらす堎合、泚釈のみが連続的に配眮できる。

<ruby>BASE<rt>annotation 1<rt>annotation 2</ruby>
<ruby>B<rt>a<rt>a</ruby><ruby>A<rt>a<rt>a</ruby><ruby>S<rt>a<rt>a</ruby><ruby>E<rt>a<rt>a</ruby>

この䞍自然な䟋においお、䞀郚のシンボルが英語ずフランス語で名前を䞎えられる。

<ruby>
 ♥ <rt> Heart <rt lang=fr> Cœur </rt>
 ☘ <rt> Shamrock <rt lang=fr> TrÚfle </rt>
 ✶ <rt> Star <rt lang=fr> Étoile </rt>
</ruby>

次の䟋のようにより耇雑な状況においお、ネストされたruby芁玠が内偎の泚釈を䞎えるために䜿甚され、党䜓のrubyが、"倖偎"レベルで泚釈を䞎える。

<ruby><ruby>B<rt>a</rt>A<rt>n</rt>S<rt>t</rt>E<rt>n</rt></ruby><rt>annotation</ruby>

ここで衚音の読みず意味の䞡方がルビ泚釈に蚘茉されおいる。倖偎のruby芁玠の子であるrt芁玠内の泚釈はひらがなを䜿っお意味を䞎える䞀方、ネストされたruby芁玠䞊の泚釈は、各芪文字のモノルビ衚音泚釈を䞎える。

<ruby><ruby>東<rt>ずう</rt>南<rt>なん</rt></ruby><rt>た぀み</rt></ruby>の方角

東ずう南なんた぀みの方角

これは同じ䟋であるが、意味は日本語の代わりに英語で䞎えられる

<ruby><ruby>東<rt>ずう</rt>南<rt>なん</rt></ruby><rt lang=en>Southeast</rt></ruby>の方角

東ずう南なんSoutheastの方角


ruby芁玠の祖先を持たないruby芁玠内で、コンテンツはセグメント化され、セグメントは3぀のカテゎリヌに眮かれるベヌステキストセグメント、泚釈セグメント、無芖セグメント。無芖されるセグメントは文曞のセマンティックスの䞀郚を圢成しないそれらは芁玠間の空癜文字およびrp芁玠で構成され、埌者は党くルビをサポヌトしないレガシヌナヌザヌ゚ヌゞェントに䜿甚される。ベヌステキストセグメントは重耇可胜であるDOMで任意の䜍眮ず重耇する2぀のセグメントの制限ずずもに、重耇するセグメントより前の始点を有する任意のセグメントはたた、同等たたはそれ以降の終点を持ち぀぀、そしお、任意のセグメントが同等たたはそれ以前の始点を持぀重耇セグメントよりも埌に終点を持぀。泚釈セグメントは、rt芁玠に察応する。各泚釈セグメントは、ベヌステキストセグメントに関連付けるこずができ、それぞれのベヌステキストセグメントは、関連付けられる泚釈セグメントを持぀こずができる。適合文曞においお、各ベヌステキストセグメントは、少なくずも1぀の泚釈セグメントに関連付けられおおり、各泚釈セグメントは1぀のベヌステキストセグメントに関連付けられおいる。ruby芁玠は、泚釈セグメントにこれらのベヌステキストセグメントからマッピングず䞀緒に、それに含たれるベヌステキストセグメントの結合を衚す。セグメントは、DOMの範囲の芳点から説明され、泚釈セグメントの範囲は垞に正確に1぀の芁玠で構成される。[DOM]

任意の特定の時点における、ruby芁玠のコンテンツのセグメンテヌションず分類は、次のアルゎリズムを実行しお埗られたであろう結果である

  1. base text segmentsをベヌステキストセグメントの空のリストにする。

  2. Let annotation segmentsを泚釈セグメントの空のリストにし、それぞれが朜圚的にベヌステキストセグメントたたはサブセグメントに関連付ける。

  3. アルゎリズムが実行しおいるものに察しおrootをruby芁玠ずする。

  4. rootがruby芁玠の祖先を持぀堎合、ステップラベルendにゞャンプする。

  5. current parentをrootにする。

  6. indexを0にする。

  7. start indexをnullにする。

  8. saved start indexをnullにする。

  9. current base textをnullにする。

  10. Start mode: If index is greater than or equal to the number of child nodes in current parent, then jump to the step labeled end mode.

  11. current parentでindex番目のノヌドがrtたたは rp芁玠の堎合、annotation modeのラベルが付いたステップぞゞャンプする。

  12. start indexをindexの倀に蚭定する。

  13. Base modecurrent parentでのindex番目のノヌドがruby芁玠の堎合、か぀current parentがrootず同じ芁玠の堎合、rubyレベルをプッシュし、ラベルstart modeのステップにゞャンプする。

  14. current parentでindex番目のノヌドがrtたたは rp芁玠の堎合、珟圚のベヌステキストを蚭定し、ラベルannotation modeのステップにゞャンプする。

  15. indexを1でむンクリメントする。

  16. Base mode post-increment: If index is greater than or equal to the number of child nodes in current parent, then jump to the step labeled end mode.

  17. base modeにラベル付けされたステップにゞャンプする。

  18. Annotation modecurrent parentでindex番目のノヌドがrt芁玠の堎合、ルビ泚釈をプッシュし、ラベルannotation mode incrementにゞャンプする。

  19. current parentでindex番目のノヌドがrp芁玠の堎合、 ラベルannotation mode incrementのステップにゞャンプする。

  20. current parentでindex番目のノヌドがTextノヌドでない、たたは芁玠間の空癜文字でないTextノヌドの堎合、ラベルbase modeのステップにゞャンプする。

  21. Annotation mode incrementlookahead indexをindexに1加えるものにする。

  22. Annotation mode white-space skipper lookahead indexがcurrent parentで子ノヌドの数以䞊の堎合、ラベルend modeのステップにゞャンプする。

  23. current parentでのlookahead index番目のノヌドがrt芁玠たたはrp芁玠である堎合、indexに lookahead indexを蚭定し、ラベルannotation modeのステップにゞャンプする。

  24. current parentでのlookahead index番目のノヌドがTextノヌドでない、たたは芁玠間の空癜文字でないTextノヌドである堎合、ラベルbase modeのステップにゞャンプするさらにindexをむンクリメントせず、芁玠間の空癜文字が芋られる範囲では次のベヌステキストセグメントの䞀郚になる

  25. lookahead indexを1でむンクリメントする。

  26. ラベルannotation mode white-space skipperのステップにゞャンプする。

  27. End mode current parentがrootず同じ芁玠でない堎合、ルビレベルをポップし、ラベルbase mode post-incrementのステップにゞャンプする。

  28. End base text segmentsおよびannotation segmentsを返す。これらリストのいずれかのセグメントによっお説明されないruby芁玠の任意のコンテンツは、暗黙のうちにignored segmentである。

䞊蚘のステップで珟圚のベヌステキストを蚭定するずいう堎合、これは、アルゎリズムでその時点の次のステップを実行するこずを意味する

  1. text rangeを境界ポむントcurrent parent、start indexで開始し、境界ポむント(current parent, index)で終了するDOM範囲にする。

  2. Let new text segment be a base text segment described by the range text range.

  3. new text segmentをbase text segmentsに加える。

  4. current base textをnew text segmentにする。

  5. start indexをnullにする。

䞊蚘のステップでルビレベルをプッシュするずいう堎合、これは、アルゎリズムでその時点の次のステップを実行するこずを意味する

  1. current parentをcurrent parentのindex番目のノヌドにする。

  2. indexを0にする。

  3. saved start indexをstart indexの倀に蚭定する。

  4. start indexをnullにする。

䞊蚘のステップでルビレベルをポップするずいう堎合、これは、アルゎリズムでその時点の次のステップを実行するこずを意味する

  1. indexをrootでcurrent parentの䜍眮にする。

  2. current parentをrootにする。

  3. indexを1でむンクリメントする。

  4. start indexをsaved start indexの倀に蚭定する。

  5. saved start indexをnullにする。

䞊蚘のステップでルビ泚釈をプッシュするずいう堎合、これは、アルゎリズムでその時点の次のステップを実行するこずを意味する

  1. rtをcurrent parentのindex番目のノヌドであるrt芁玠にする。

  2. annotation rangeを境界ポむントcurrent parent、start indexで開始し、境界ポむントcurrent parent、indexに1を加える)すなわちrtのみを含むで終了するDOM範囲にする。

  3. new annotation segmentを範囲annotation rangeで蚘述される泚釈セグメントにする。

  4. current base textがnullでない堎合、new annotation segmentずcurrent base textを結び぀けお考える。

  5. new annotation segmentをannotation segmentsに加える。

この䟋においお、日本語テキスト挢字での各衚意文字は、そのひらがなでの読みに結び぀けられる。

...
<ruby>挢<rt>かん</rt>字<rt>じ</rt></ruby>
...

これはこのようにレンダリングされるだろう

2぀の䞻衚意文字の各ひらがなでの泚釈は、䞊に小さなフォントでレンダリングされる。

この䟋においお、繁䜓字テキスト挢字での各衚意文字は、その泚音笊号での読みに結び぀けられる。

<ruby>挢<rt>ㄏㄢˋ</rt>字<rt>ㄗˋ</rt></ruby>

これはこのようにレンダリングされるだろう

2぀の䞻衚意文字の各泚音笊号での泚釈は、暪に小さなフォントでレンダリングされる。

この䟋においお、簡䜓字テキスト汉字での各衚意文字は、そのピンむンでの読みに結び぀けられる。

...<ruby>汉<rt>hàn</rt>字<rt>zì</rt></ruby>...

これはこのようにレンダリングされるだろう

2぀の䞻衚意文字の各ピンむンでの泚釈は、䞊に小さなフォントでレンダリングされる。

このより蚈画的な䟋においお、頭字語"HTML"は4぀の泚釈を持぀。1぀は頭字語党䜓に察するもので、これが䜕であるかを簡単に説明し、1぀は文字"HT"を展開した"Hypertext"、1぀は文字Mを展開した"Markup"、1぀は文字"L"を展開した"Language"である。

<ruby>
 <ruby>HT<rt>Hypertext</rt>M<rt>Markup</rt>L<rt>Language</rt></ruby>
 <rt>An abstract language for describing documents and applications
</ruby>

4.5.11 rt芁玠

Element/rt

Support in all current engines.

Firefox38+Safari5+Chrome5+
Opera?Edge79+
Edge (Legacy)?Internet Explorer5+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
なし。
この芁玠を䜿甚できるコンテキスト
ruby芁玠の子ずしお。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
rt芁玠が別のrtたたはrp芁玠の盎埌に存圚する堎合、たたは芪芁玠に远加のコンテンツが存圚しない堎合、rt芁玠の終了タグは省略するこずができる。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

rt芁玠は、ルビ泚釈のルビテキストコンポヌネントをマヌクする。芁玠がruby芁玠の子である堎合、芁玠は䜕らそれ自身を衚さないが、ruby芁玠はそれが䜕を衚すかを決定するものの䞀郚ずしお䜿甚する。

ruby芁玠の子でないrt芁玠は、その子ず同じものを衚す。

4.5.12 rp芁玠

Element/rp

Support in all current engines.

Firefox38+Safari5+Chrome5+
Opera?Edge79+
Edge (Legacy)?Internet Explorer5+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
なし。
この芁玠を䜿甚できるコンテキスト
盎前たたは盎埌のrt芁玠のいずれかで、ruby芁玠の子ずしお。
コンテンツモデル
Text。
text/htmlにおけるタグ省略
rp芁玠が別のrtたたはrp芁玠の盎埌に存圚する堎合、たたは芪芁玠に远加のコンテンツが存圚しない堎合、rp芁玠の終了タグは省略するこずができる。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

rp芁玠は、ルビ泚釈をサポヌトしないナヌザヌ゚ヌゞェントによっお瀺される、ルビ泚釈のルビテキストコンポヌネントを囲む括匧たたは別のコンテンツを提䟛するために䜿甚できる。

ruby芁玠の子であるrp芁玠は䜕も衚さない。芪芁玠がruby芁玠でないrp芁玠は、その子を衚す。

テキスト挢字での各衚意文字はその読みふりがなの泚釈をも぀䞊蚘の䟋は、レガシヌナヌザヌ゚ヌゞェントでの読みは括匧内にあるので、rpを䜿甚するように拡匵できる

...
<ruby>挢<rp></rp><rt>かん</rt><rp></rp>字<rp></rp><rt>じ</rt><rp></rp></ruby>
...

適合ナヌザヌ゚ヌゞェントでのレンダリングは前述のようになるが、ルビがサポヌトされないナヌザヌ゚ヌゞェントにおいお、レンダリングは次のようになるだろう

... 挢かん字じ...

セグメントに耇数の泚釈がある堎合、rp芁玠はたた泚釈の間に配眮できる。これは英語ずフランス語で䞎えられた名前を持぀䞀郚のシンボルを瀺す以前の䞍自然な䟋の別のコピヌだが、今回は同様にrp芁玠をも぀

<ruby>
♥<rp>: </rp><rt>Heart</rt><rp>, </rp><rt lang=fr>Cœur</rt><rp>.</rp>
☘<rp>: </rp><rt>Shamrock</rt><rp>, </rp><rt lang=fr>TrÚfle</rt><rp>.</rp>
✶<rp>: </rp><rt>Star</rt><rp>, </rp><rt lang=fr>Étoile</rt><rp>.</rp>
</ruby>

これは、たずえばレンダリングが非ルビ察応のナヌザヌ゚ヌゞェントでは次のようになるだろう

♥: Heart, Cœur. ☘: Shamrock, TrÚfle. ✶: Star, Étoile.

4.5.13 data芁玠

Element/data

Support in all current engines.

Firefox22+Safari10+Chrome62+
Opera?Edge79+
Edge (Legacy)18Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLDataElement

Support in all current engines.

Firefox22+Safari10+Chrome62+
Opera?Edge79+
Edge (Legacy)14+Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLDataElement/value

Support in all current engines.

Firefox22+Safari10+Chrome62+
Opera?Edge79+
Edge (Legacy)14+Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
value — 機械可読な倀
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
属性valueを䌎っおデフォルト。
DOMむンタヌフェむス
[Exposed=Window]
interface HTMLDataElement : HTMLElement {
  [HTMLConstructor] constructor();

  [CEReactions, Reflect] attribute DOMString value;
};

data芁玠は、value属性でコンテンツの機械可読圢匏に沿っお、そのコンテンツを衚す。

value属性が存圚しなければならない。その倀は、機械可読圢匏での芁玠コンテンツの衚珟でなければならない。

倀が日付たたは時刻に関連する堎合、より具䜓的なtime芁玠を代わりに䜿甚できる。

芁玠はいく぀かの目的に䜿甚できる。

この仕様で定矩されるマむクロフォヌマットたたはマむクロデヌタ属性ず組み合わせた堎合、芁玠は、デヌタプロセッサの目的のために機械可読な倀、およびりェブブラりザヌでレンダリング目的のために人間可読な倀の䞡方を提䟛する圹割を果たす。この堎合、value属性で䜿甚されるフォヌマットは、䜿甚䞭のマむクロフォヌマットたたはマむクロデヌタ語圙によっお決定される。

しかし、芁玠はたた、人間可読な倀ず䞀緒に栌玍するリテラルな倀を持぀ずきに、ペヌゞ内でスクリプトず䜵せお䜿甚される。このような堎合、䜿甚されるフォヌマットは、スクリプトの芁求に䟝存する。data-*属性もそのような状況においお有甚でありうる。

ここでは、短いテヌブルが、1列のテキスト圢匏でか぀別に分解された圢匏で提瀺された数字にもかかわらず、テヌブル゜ヌトJavaScriptラむブラリヌは各列の゜ヌトメカニズムを提䟛するこずができるようにdataを甚いお゚ンコヌドされた数倀を持぀。

<script src="sortable.js"></script>
<table class="sortable">
 <thead> <tr> <th> Game <th> Corporations <th> Map Size
 <tbody>
  <tr> <td> 1830 <td> <data value="8">Eight</data> <td> <data value="93">19+74 hexes (93 total)</data>
  <tr> <td> 1856 <td> <data value="11">Eleven</data> <td> <data value="99">12+87 hexes (99 total)</data>
  <tr> <td> 1870 <td> <data value="10">Ten</data> <td> <data value="149">4+145 hexes (149 total)</data>
</table>

4.5.14 time芁玠

Element/time

Support in all current engines.

Firefox22+Safari7+Chrome62+
Opera49+Edge79+
Edge (Legacy)18Internet ExplorerNo
Firefox Android?Safari iOS4+Chrome Android?WebView Android?Samsung Internet?Opera Android46+

HTMLTimeElement

Support in all current engines.

Firefox22+Safari10+Chrome62+
Opera49+Edge79+
Edge (Legacy)14+Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android46+

HTMLTimeElement/dateTime

Support in all current engines.

Firefox22+Safari10+Chrome62+
Opera49+Edge79+
Edge (Legacy)14+Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android46+
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
芁玠がdatetime属性をも぀堎合フレヌゞングコンテンツ。
そうでなければText。ただし、本文で䞎えられる芁件にマッチしなければならない。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
datetime — 機械可読な倀
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
属性datetimeを䌎っおデフォルト。
DOMむンタヌフェむス
[Exposed=Window]
interface HTMLTimeElement : HTMLElement {
  [HTMLConstructor] constructor();

  [CEReactions, Reflect] attribute DOMString dateTime;
};

time芁玠は、datetime属性でコンテンツの機械可読圢匏に沿っお、そのコンテンツを衚す。コンテンツの皮類は、以䞋に説明するような、日付、時刻、タむムゟヌンのオフセット、および期間の様々な皮類に限定される。

datetime属性は存圚しおもよい。存圚する堎合、その倀は、機械可読圢匏での芁玠コンテンツの衚珟でなければならない。

datetime型のコンテンツ属性を持たないtime芁玠は、任意の芁玠の子孫を持っおはならない。

もし持぀堎合、time芁玠の日付時刻倀は芁玠のdatetimeコンテンツ属性倀であり、そうでなければ、time芁玠の子テキストコンテンツである。

time芁玠の日付時刻倀は次の構文のいずれかず䞀臎しなければならない。

劥圓な月文字列
<time>2011-11</time>
劥圓な日付文字列
<time>2011-11-18</time>
劥圓な幎のない日付文字列
<time>11-18</time>
劥圓な時刻文字列
<time>14:54</time>
<time>14:54:39</time>
<time>14:54:39.929</time>
劥圓なロヌカル日付および時刻文字列
<time>2011-11-18T14:54</time>
<time>2011-11-18T14:54:39</time>
<time>2011-11-18T14:54:39.929</time>
<time>2011-11-18 14:54</time>
<time>2011-11-18 14:54:39</time>
<time>2011-11-18 14:54:39.929</time>

タむムゟヌンオフセットのない日付は、終日、各タむムゟヌンに同じ特定の時刻で芳察されるむベントを指定するのに䟿利である。たずえば、2020幎の新幎は、すべおのタむムゟヌンで同䞀の正確な瞬間ではなく、それぞれのタむムゟヌンで2020幎1月1日0時0分に祝われる。すべおのタむムゟヌンで同時に発生したむベントの堎合、たずえばテレビ䌚議の䌚議においお、劥圓なグロヌバル日付および時刻文字列は、おそらくより有甚である。

劥圓なタむムゟヌンオフセット文字列
<time>Z</time>
<time>+0000</time>
<time>+00:00</time>
<time>-0800</time>
<time>-08:00</time>

日付なしの時刻たたは耇数日で繰り返されるむベントを参照する時刻に぀いお、地理的な䜍眮がサマヌタむムずずもにタむムゟヌンオフセットを倉曎するため、時刻を制埡する地理的な䜍眮を指定するこずは、通垞タむムゟヌンオフセットを指定するよりも有甚である。䞀郚の堎合、たずえば、これらのタむムゟヌンの境界を再描画する堎合、2011幎末にサモアで起きたように、地理的な堎所でもタむムゟヌンを倉曎する。タむムゟヌンの境界およびどのような芏則が各ゟヌン内で適甚されるのかを説明する、タむムゟヌンデヌタベヌスずしお知られるものが存圚する。[TZDATABASE]

劥圓なグロヌバル日付および時刻文字列
<time>2011-11-18T14:54Z</time>
<time>2011-11-18T14:54:39Z</time>
<time>2011-11-18T14:54:39.929Z</time>
<time>2011-11-18T14:54+0000</time>
<time>2011-11-18T14:54:39+0000</time>
<time>2011-11-18T14:54:39.929+0000</time>
<time>2011-11-18T14:54+00:00</time>
<time>2011-11-18T14:54:39+00:00</time>
<time>2011-11-18T14:54:39.929+00:00</time>
<time>2011-11-18T06:54-0800</time>
<time>2011-11-18T06:54:39-0800</time>
<time>2011-11-18T06:54:39.929-0800</time>
<time>2011-11-18T06:54-08:00</time>
<time>2011-11-18T06:54:39-08:00</time>
<time>2011-11-18T06:54:39.929-08:00</time>
<time>2011-11-18 14:54Z</time>
<time>2011-11-18 14:54:39Z</time>
<time>2011-11-18 14:54:39.929Z</time>
<time>2011-11-18 14:54+0000</time>
<time>2011-11-18 14:54:39+0000</time>
<time>2011-11-18 14:54:39.929+0000</time>
<time>2011-11-18 14:54+00:00</time>
<time>2011-11-18 14:54:39+00:00</time>
<time>2011-11-18 14:54:39.929+00:00</time>
<time>2011-11-18 06:54-0800</time>
<time>2011-11-18 06:54:39-0800</time>
<time>2011-11-18 06:54:39.929-0800</time>
<time>2011-11-18 06:54-08:00</time>
<time>2011-11-18 06:54:39-08:00</time>
<time>2011-11-18 06:54:39.929-08:00</time>

日付ずタむムゟヌンオフセットを持぀時刻は、特定のむベント、たたは時刻が特定の地理的な䜍眮に固定されない定期的な仮想のむベントを指定するのに䟿利である。たずえば、䞖界の任意の特定郚分がサマヌタむムを芳察するかどうかにかかわらず、小惑星衝突たたは、毎日1400 UTCに開催されるある䞀連の䌚議の正確な時刻。特定の地理的䜍眮のロヌカルタむムゟヌンオフセットによっお正確な時刻が異なるむベントにおいお、その地理的䜍眮ず組み合わせた劥圓なロヌカルの日付および時刻文字列がより䟿利だろう。

劥圓な週文字列
<time>2011-W47</time>
4぀以䞊のASCII数字で、少なくずも1぀はU+0030 DIGIT ZERO0でない。
<time>2011</time>
<time>0001</time>
劥圓な期間文字列
<time>PT4H18M3S</time>
<time>4h 18m 3s</time>

芁玠のコンテンツの機械可読な等䟡物は、次のアルゎリズムを䜿甚するこずで芁玠の日付時刻倀から取埗しなければならない

  1. If parsing a month string from the element's datetime value returns a month, that is the machine-readable equivalent; return.

  2. If parsing a date string from the element's datetime value returns a date, that is the machine-readable equivalent; return.

  3. If parsing a yearless date string from the element's datetime value returns a yearless date, that is the machine-readable equivalent; return.

  4. If parsing a time string from the element's datetime value returns a time, that is the machine-readable equivalent; return.

  5. If parsing a local date and time string from the element's datetime value returns a local date and time, that is the machine-readable equivalent; return.

  6. If parsing a time-zone offset string from the element's datetime value returns a time-zone offset, that is the machine-readable equivalent; return.

  7. If parsing a global date and time string from the element's datetime value returns a global date and time, that is the machine-readable equivalent; return.

  8. If parsing a week string from the element's datetime value returns a week, that is the machine-readable equivalent; return.

  9. If the element's datetime value consists of only ASCII digits, at least one of which is not U+0030 DIGIT ZERO (0), then the machine-readable equivalent is the base-ten interpretation of those digits, representing a year; return.

  10. If parsing a duration string from the element's datetime value returns a duration, that is the machine-readable equivalent; return.

  11. 機械可読な等䟡物は存圚しない。

䞊蚘で参照したアルゎリズムは、アルゎリズムの1぀のみが倀を返すよう、任意の文字列sに察しお蚭蚈されるよう意図される。より効率的なアプロヌチは、1぀のパス内のすべおのこのデヌタ型を解析する単䞀のアルゎリズムを䜜成するこずかもしれない。そのようなアルゎリズムを開発するこずは読者ぞの課題ずしお残される。

time芁玠は、たずえばマむクロフォヌマットの䞭で、日付を゚ンコヌドするために䜿甚できる。以䞋は、time芁玠を䜿甚するhCalendarの倉皮を䜿ったむベントを゚ンコヌドするための仮想的方法を瀺す

<div class="vevent">
 <a class="url" href="http://www.web2con.com/">http://www.web2con.com/</a>
 <span class="summary">Web 2.0 Conference</span>:
 <time class="dtstart" datetime="2005-10-05">October 5</time> -
 <time class="dtend" datetime="2005-10-07">7</time>,
 at the <span class="location">Argent Hotel, San Francisco, CA</span>
</div>

ここでは、Atom語圙に基づく架空のマむクロデヌタ語圙が、ブログ蚘事の発行日をマヌクアップするtime芁玠で䜿甚される。

<article itemscope itemtype="https://n.example.org/rfc4287">
 <h1 itemprop="title">Big tasks</h1>
 <footer>Published <time itemprop="published" datetime="2009-08-29">two days ago</time>.</footer>
 <p itemprop="content">Today, I went out and bought a bike for my kid.</p>
</article>

この䟋においお、もう1぀の蚘事の出版日は、schema.orgのマむクロデヌタ語圙を䜿甚しお、timeを䜿っおマヌクアップされる。

<article itemscope itemtype="http://schema.org/BlogPosting">
 <h1 itemprop="headline">Small tasks</h1>
 <footer>Published <time itemprop="datePublished" datetime="2009-08-30">yesterday</time>.</footer>
 <p itemprop="articleBody">I put a bike bell on her bike.</p>
</article>

次の断片においお、time芁玠は、埌でスクリプトによっお凊理するために、ISO8601圢匏で日付を゚ンコヌドしお䜿甚される

<p>Our first date was <time datetime="2006-09-23">a Saturday</time>.</p>

この2぀目の断片では、倀は時刻を含む

<p>We stopped talking at <time datetime="2006-09-24T05:00-07:00">5am the next morning</time>.</p>

ペヌゞおよびtime芁玠を䜿甚しお日付ず時刻をマヌクアップするのペヌゞの内郚芏則に関係するものによっおロヌドされたスクリプトは、ペヌゞをスキャンしお、その䞭に日付ず時刻のむンデックスを䜜成するためにすべおのtime芁玠を芋るかもしれない。

たずえば、この芁玠は2011幎11月18日が"金曜日"に盞圓する意味であるこずを远加のセマンティックを持぀文字列"Friday"に䌝える

Today is <time datetime="2011-11-18">Friday</time>.

この䟋では、倪平掋暙準時で特定の時刻を指定する

Your next meeting is at <time datetime="2011-11-18T15:00-08:00">3pm</time>.

4.5.15 code芁玠

Element/code

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

code芁玠は、コンピュヌタヌコヌドの断片を衚す。これは、XML芁玠名、ファむル名、コンピュヌタヌプログラム、たたはコンピュヌタヌが認識するだろう文字列であるかもしれない。

マヌクアップされおいるコンピュヌタヌコヌドの蚀語を瀺すための、正匏な方法はない。䜿甚される蚀語ず䞀緒にcode芁玠をマヌクしたい著者は、たずえば構文匷調衚瀺スクリプトが正しい芏則を䜿甚できるように、たずえば芁玠に"language-"で始たるクラスを远加するこずによっお、classを䜿甚できる。

次の䟋は、句読点を含む、芁玠名ずコンピュヌタヌコヌドをマヌクアップするために段萜で芁玠が䜿甚できる様子を瀺す。

<p>The <code>code</code> element represents a fragment of computer
code.</p>

<p>When you call the <code>activate()</code> method on the
<code>robotSnowman</code> object, the eyes glow.</p>

<p>The example below uses the <code>begin</code> keyword to indicate
the start of a statement block. It is paired with an <code>end</code>
keyword, which is followed by the <code>.</code> punctuation character
(full stop) to indicate the end of the program.</p>

次の䟋は、コヌドのブロックがpreおよびcode芁玠を甚いおマヌクアップする方法を瀺す。

<pre><code class="language-pascal">var i: Integer;
begin
   i := 1;
end.</code></pre>

クラスは、䜿甚される蚀語を瀺すためにこの䟋で䜿甚されおいる。

詳现に぀いおは、pre芁玠を参照のこず。

4.5.16 var芁玠

Element/var

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

var芁玠は倉数を衚す。これは、数匏やプログラミングコンテキスト、定数を衚す識別子、物理量を識別する蚘号、関数パラメヌタヌ、たたは単に文のプレヌスホルダヌずしお䜿甚される甚語で、実際に倉数であるかもしれない。

次の段萜で、文字"n"が文で倉数ずしお䜿甚される

<p>If there are <var>n</var> pipes leading to the ice
cream factory then I expect at <em>least</em> <var>n</var>
flavors of ice cream to be available for purchase!</p>

数孊に぀いお、具䜓的には最も簡朔な匏の範囲を超えるすべおのものに察しお、MathMLはより適切である。しかし、var芁玠は䟝然ずしおMathMLの衚珟で蚀及される特定の倉数を参照するために䜿甚できる。

この䟋においお、匏の䞭で倉数を参照する説明ずずもに、匏が瀺される。匏そのものはMathMLでマヌクアップされるが、倉数はvarを䜿甚しおfigureの凡䟋に蚘茉される。

<figure>
 <math>
  <mi>a</mi>
  <mo>=</mo>
  <msqrt>
   <msup><mi>b</mi><mn>2</mn></msup>
   <mi>+</mi>
   <msup><mi>c</mi><mn>2</mn></msup>
  </msqrt>
 </math>
 <figcaption>
  Using Pythagoras' theorem to solve for the hypotenuse <var>a</var> of
  a triangle with sides <var>b</var> and <var>c</var>
 </figcaption>
</figure>

ここで、質量ず゚ネルギヌの等䟡性を蚘述する方皋匏は文䞭で䜿甚され、そしおvar芁玠は、その匏の倉数ず定数をマヌクするために䜿甚される

<p>Then she turned to the blackboard and picked up the chalk. After a few moment's
thought, she wrote <var>E</var> = <var>m</var> <var>c</var><sup>2</sup>. The teacher
looked pleased.</p>

4.5.17 samp芁玠

Element/samp

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

samp芁玠は、サンプルたたは別のプログラムたたはコンピュヌティングシステムからの匕甚出力を衚す。

詳现に぀いおは、preおよびkbd芁玠を参照のこず。

この芁玠は、output芁玠ず察比でき、これはりェブアプリケヌションで即時出力を提䟛するために䜿甚できる。

この䟋はむンラむンで䜿甚されおいるsamp芁玠を瀺す

<p>The computer said <samp>Too much cheese in tray
two</samp> but I didn't know what that meant.</p>

この2番目の䟋は、コン゜ヌルプログラム由来のサンプル出力のブロックを瀺す。ネストされたsampずkbd芁玠は、スタむルシヌトを䜿甚するサンプル出力の特定芁玠のスタむリングを可胜にする。非垞に正確なスタむリングを可胜にするために、さらに詳现なマヌクアップ泚釈を付けるsampの郚分もある。これを達成するために、span芁玠が䜿甚される。

<pre><samp><span class="prompt">jdoe@mowmow:~$</span> <kbd>ssh demo.example.com</kbd>
Last login: Tue Apr 12 09:10:17 2005 from mowmow.example.com on pts/1
Linux demo 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189 #1 SMP Tue Feb 1 11:22:36 PST 2005 i686 unknown

<span class="prompt">jdoe@demo:~$</span> <span class="cursor">_</span></samp></pre>

この3番目の䟋は、入力およびそのそれぞれの出力のブロックを瀺す。この䟋では、codeずsamp芁玠の䞡方を䜿甚する。

<pre>
<code class="language-javascript">console.log(2.3 + 2.4)</code>
<samp>4.699999999999999</samp>
</pre>

4.5.18 kbd芁玠

Element/kbd

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

kbd芁玠は、ナヌザヌの入力この芁玠はたた、音声コマンドなど、他の入力を衚すために䜿甚されるかもしれないが、通垞はキヌボヌド入力を衚す。

kbd芁玠がsamp芁玠内にネストされる堎合、この芁玠はシステムによっお゚コヌされたような入力を衚す。

kbd芁玠がsamp芁玠を含む堎合、この芁玠はメニュヌ項目を呌び出す䟋に察しお、システムの出力に基づく入力を衚す。

kbd芁玠が他のkbd芁玠内にネストされる堎合、入力メカニズムに応じお、実際のキヌたたはその他の入力の単䞀の単䜍を衚す。

ここで、kbd芁玠は抌すべきキヌを瀺すために䜿甚される

<p>To make George eat an apple, press <kbd><kbd>Shift</kbd> + <kbd>F3</kbd></kbd></p>

この2番目の䟋においお、ナヌザヌは特定のメニュヌ項目を遞択するように告げられる。倖偎のkbd芁玠は、入力のそれぞれ個別の手順を衚す内偎のkbd芁玠ずずもに、入力のブロックをマヌクアップし、それらの内偎のsamp芁玠は、メニュヌラベルの堎合では、手順がシステムによっお衚瀺されおいるものに基づいお入力されるこずを瀺す

<p>To make George eat an apple, select
    <kbd><kbd><samp>File</samp></kbd>|<kbd><samp>Eat Apple...</samp></kbd></kbd>
</p>

このような粟密さは必芁ない。以䞋で十分である。

<p>To make George eat an apple, select <kbd>File | Eat Apple...</kbd></p>

4.5.19 subおよびsup芁玠

Element/sub

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

Element/sup

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
sub芁玠著者向け、実装者向け。
sup芁玠著者向け、実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

sup芁玠は、䞊付き文字を衚し、sub芁玠は、䞋付き文字を衚す。

これらの芁玠は、プレれンテヌションの目的に察する衚蚘芏則のためでなく、明確な意味を䌎う衚蚘芏則をマヌクアップするためのみに䜿甚しなければならない。たずえば、subおよびsup芁玠にLaTeX文曞䜜成システムの名前に䜿甚するこずは䞍適切だろう。䞀般に、これら芁玠の䞍圚がコンテンツの意味を倉曎するような堎合にのみ、著者はこれらの芁玠を䜿甚すべきである。

特定の蚀語においお、䞊付き文字は略語の衚蚘芏則の䞀郚である。

<p>Their names are
<span lang="fr"><abbr>M<sup>lle</sup></abbr> Gwendoline</span> and
<span lang="fr"><abbr>M<sup>me</sup></abbr> Denise</span>.</p>

䞋付き文字を持぀倉数に察しお、sub芁玠はvar芁玠内で䜿甚できる。

ここで、sub芁玠は倉数矀で倉数を識別する添え字を衚すために䜿甚される

<p>The coordinate of the <var>i</var>th point is
(<var>x<sub><var>i</var></sub></var>, <var>y<sub><var>i</var></sub></var>).
For example, the 10th point has coordinate
(<var>x<sub>10</sub></var>, <var>y<sub>10</sub></var>).</p>

数匏は、しばしば䞊付き文字ず䞋付き文字を䜿甚する。著者は、数孊的衚珟をマヌクアップするためにMathMLを䜿甚するよう掚奚されるが、詳现な数孊的マヌクアップを望たない堎合、著者はsubおよびsupを䜿甚するこずを遞んでもよい。[MATHML]

<var>E</var>=<var>m</var><var>c</var><sup>2</sup>
f(<var>x</var>, <var>n</var>) = log<sub>4</sub><var>x</var><sup><var>n</var></sup>

4.5.20 i芁玠

Element/i

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

i芁玠は、代わりの声やムヌドでテキストの範囲を衚すか、たたはそうでなければ、たずえば分類孊䞊の名称、専門甚語、他蚀語の慣甚句、意芋、たたは西掋のテキストで船名など、異なる品質のテキストを瀺す方法で通垞の文からのオフセットを衚す。

䞻テキストず異なる蚀語の甚語はlang属性たたは、XMLでXML名前空間のlang属性で泚釈を付けるべきである。

次の䟋は、i芁玠の甚法を瀺す

<p>The <i class="taxonomy">Felis silvestris catus</i> is cute.</p>
<p>The term <i>prose content</i> is defined above.</p>
<p>There is a certain <i lang="fr">je ne sais quoi</i> in the air.</p>

次の䟋においお、倢の堎面はi芁玠を甚いおマヌクアップされる。

<p>Raymond tried to sleep.</p>
<p><i>The ship sailed away on Thursday</i>, he
dreamt. <i>The ship had many people aboard, including a beautiful
princess called Carey. He watched her, day-in, day-out, hoping she
would notice him, but she never did.</i></p>
<p><i>Finally one night he picked up the courage to speak with
her—</i></p>
<p>Raymond woke with a start as the fire alarm rang out.</p>

特定の甚途のスタむルたずえば、分類孊䞊の甚語でないものずしおの倢の堎面が埌日倉曎される堎合、著者が各甚途の泚釈を文曞党䜓たたは関連する䞀連の文曞を怜蚎する必芁がないよう、著者は芁玠が䜿甚されおいる理由を識別するためのi芁玠にclass属性を䜿甚できる。

著者は、i芁玠よりもより適切な他の芁玠があるかどうか、たずえば、匷調をマヌクアップするためのem芁玠、たたは甚語の定矩䟋をマヌクアップするためのdfn芁玠などを怜蚎するこずを掚奚する。

スタむルシヌトは、任意の芁玠が再スタむル付けできるように、i芁玠の曞匏を蚭定するために䜿甚できる。したがっお、この堎合においおi芁玠のコンテンツが、必ずしもむタリック䜓であるずは限らない。

4.5.21 b芁玠

Element/b

Support in all current engines.

Firefox1+Safari1+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

b芁玠は、たずえば、文曞の抂芁でのキヌワヌド、レビュヌでの補品名、察話的なテキスト駆動型゜フトりェアでの䜿甚可胜語、たたは蚘事リヌドなど、特別な重芁性を䌝えるこずなく、代わりの声やムヌドの意味合いなしに、実甚的な目的に察しお描かれおいる泚目すべきテキストの範囲を衚す。

次の䟋は、重芁なものずしおマヌクせずにキヌワヌドを匷調するためのb芁玠の䜿甚方法を瀺す

<p>The <b>frobonitor</b> and <b>barbinator</b> components are fried.</p>

次の䟋においお、テキストアドベンチャヌ内のオブゞェクトは、b芁玠を䜿甚するこずにより、特別なものずしお匷調される。

<p>You enter a small room. Your <b>sword</b> glows
brighter. A <b>rat</b> scurries past the corner wall.</p>

b芁玠が適切であるもう1぀のケヌスは、リヌド文たたは段萜をマヌクアップである。次の䟋は、りサギを逊子にする子猫に関するBBCの蚘事をマヌクアップする様子を瀺す

<article>
 <h2>Kittens 'adopted' by pet rabbit</h2>
 <p><b class="lede">Six abandoned kittens have found an
 unexpected new mother figure — a pet rabbit.</b></p>
 <p>Veterinary nurse Melanie Humble took the three-week-old
 kittens to her Aberdeen home.</p>
[...]

i芁玠ず同様に、著者は、特定の甚途のスタむルが埌日倉曎される堎合、著者が各甚途の泚釈を怜蚎する必芁がないよう、著者は芁玠が䜿甚されおいる理由を識別するためのb芁玠にclass属性を䜿甚できる。

他により適切な芁玠がない堎合に、b芁玠は最埌の手段ずしお䜿甚すべきである。具䜓的には、芋出しはh1からh6たでの芁玠を䜿甚すべきであり、匷調はem芁玠を䜿うべきであり、重芁性はstrong芁玠で衚されるべきであり、テキストのマヌクたたは匷調は、mark芁玠を䜿甚すべきである。

以䞋は、間違った䜿甚法になる

<p><b>WARNING!</b> Do not frob the barbinator!</p>

䞊の䟋においお、䜿甚すべき適切な芁玠はbではなく、strongだろう。

スタむルシヌトは、任意の芁玠が再スタむル付けできるように、b芁玠の曞匏を蚭定するために䜿甚できる。したがっお、この堎合においおb芁玠のコンテンツが、必ずしも倪字であるずは限らない。

4.5.22 u芁玠

Element/u

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android4+Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

u芁玠は、明瀺的にレンダリングされるが、非テキストの泚釈、たずえば䞭囜語のテキストで固有名詞䞭囜語の固有名詞のマヌクずしおテキストを分類する、たたはスペルミスずしおテキストを分類するような、明瞭に発音されないテキストの範囲を衚す。

ほずんどの堎合、別の芁玠がより適切である可胜性が高い。匷調のマヌクアップに察しおem芁玠を䜿甚すべきであり、キヌワヌドやフレヌズに察しお、コンテキストに応じおb芁玠かmark芁玠のいずれかを䜿甚すべきであり、本のタむトルのマヌクアップに察しおcite芁玠を䜿甚すべきであり、明瀺的なテキスト泚釈をも぀テキストのラベル付けに察しおruby芁玠を䜿甚すべきであり、技術甚語、分類孊䞊の名称、音蚳、意図、たたは西掋の文曞で船名を暙識するためにi芁玠を䜿甚すべきである。

芖芚プレれンテヌションでu芁玠の既定のレンダリングは、ハむパヌリンク䞋線の慣習的なレンダリングず衝突する。著者は、ハむパヌリンクず混同するかもしれないu芁玠を䜿甚しないよう掚奚する。

この䟋においお、u芁玠は綎り間違いずしお単語をマヌクするために䜿甚される

<p>The <u>see</u> is full of fish.</p>

4.5.23 mark芁玠

Element/mark

Support in all current engines.

Firefox4+Safari5.1+Chrome7+
Opera11+Edge79+
Edge (Legacy)12+Internet Explorer9+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

mark芁玠は、別のコンテキストにおいお関連性のために、参照目的でマヌクたたは匷調衚瀺されるある文曞内の䞀連のテキストを衚す。匕甚文たたは文から参照されるテキストのブロック内で䜿甚される堎合、ブロックが元々曞かれたずきに、元々存圚しないが、オリゞナルの著者によっお重芁だず考えられおいないかもしれないだろう、テキストの䞀郚に読者の泚意を喚起するために远加されたハむラむトを瀺す。この远加は、事前に予期しない粟査である。文曞の本文で䜿甚した堎合、ナヌザヌの珟圚のアクティビティヌに関連性が高いために匷調されおいる文曞の䞀郚を瀺す。

この䟋は、mark芁玠が匕甚の特定の郚分に泚意を喚起するために䜿甚する様子を瀺す

<p lang="en-US">Consider the following quote:</p>
<blockquote lang="en-GB">
 <p>Look around and you will find, no-one's really
 <mark>colour</mark> blind.</p>
</blockquote>
<p lang="en-US">As we can tell from the <em>spelling</em> of the word,
the person writing this quote is clearly not American.</p>

しかし、察象がスペルミスずしお芁玠をマヌクしおいた堎合、おそらくclassをも぀u芁玠がより適切だろう。

mark芁玠のもう1぀の䟋は、怜玢文字列に䞀臎しおいる文曞の郚分を匷調するこずである。誰かが文曞を芋お、ナヌザヌが単語"kitten"を探しおいたこずをサヌバヌが知っおいた堎合、サヌバヌは次のような段萜の倉曎ずずもに文曞を返すかもしれない。

<p>I also have some <mark>kitten</mark>s who are visiting me
these days. They're really cute. I think they like my garden! Maybe I
should adopt a <mark>kitten</mark>.</p>

次の断片においお、テキストの段萜はコヌド断片の特定郚分に蚀及する。

<p>The highlighted part below is where the error lies:</p>
<pre><code>var i: Integer;
begin
   i := <mark>1.1</mark>;
end.</code></pre>

spanがより適切なため、これは構文の匷調衚瀺ず区別される。䞡方組み合わせるこずで、次のようになるだろう

<p>The highlighted part below is where the error lies:</p>
<pre><code><span class=keyword>var</span> <span class=ident>i</span>: <span class=type>Integer</span>;
<span class=keyword>begin</span>
   <span class=ident>i</span> := <span class=literal><mark>1.1</mark></span>;
<span class=keyword>end</span>.</code></pre>

これは、オリゞナルでは匷調されない匕甚テキストの䞀郚を匷調するためにmarkの甚途を瀺すもう1぀の䟋である。この䟋においお共通の衚蚘芏則は、むタリック䜓でレンダリングする匕甚文で明瀺的にmark芁玠で著者にスタむル付けをもたらす。

<style>
 blockquote mark, q mark {
   font: inherit; font-style: italic;
   text-decoration: none;
   background: transparent; color: inherit;
 }
 .bubble em {
   font: inherit; font-size: larger;
   text-decoration: underline;
 }
</style>
<article>
 <h1>She knew</h1>
 <p>Did you notice the subtle joke in the joke on panel 4?</p>
 <blockquote>
  <p class="bubble">I didn't <em>want</em> to believe. <mark>Of course
  on some level I realized it was a known-plaintext attack.</mark> But I
  couldn't admit it until I saw for myself.</p>
 </blockquote>
 <p>(Emphasis mine.) I thought that was great. It's so pedantic, yet it
 explains everything neatly.</p>
</article>

ちなみに、この䟋においおem芁玠ずの区別は、匕甚されおいる元のテキストの䞀郚であり、か぀コメント郚分を匷調しおいるmark芁玠であるこずに泚意する。

次の䟋は、テキストの範囲markの関連性を瀺すこずず察照的に、テキストの範囲strongの重芁性を瀺すこずずの違いを瀺す。これは、抜出物が詊隓の匷調に関連する郚分を持っおいた教科曞からの抜粋である。安党䞊の譊告は重芁であるかもしれないが、明らかに詊隓に関連しない。

<h3>Wormhole Physics Introduction</h3>

<p><mark>A wormhole in normal conditions can be held open for a
maximum of just under 39 minutes.</mark> Conditions that can increase
the time include a powerful energy source coupled to one or both of
the gates connecting the wormhole, and a large gravity well (such as a
black hole).</p>

<p><mark>Momentum is preserved across the wormhole. Electromagnetic
radiation can travel in both directions through a wormhole,
but matter cannot.</mark></p>

<p>When a wormhole is created, a vortex normally forms.
<strong>Warning: The vortex caused by the wormhole opening will
annihilate anything in its path.</strong> Vortexes can be avoided when
using sufficiently advanced dialing technology.</p>

<p><mark>An obstruction in a gate will prevent it from accepting a
wormhole connection.</mark></p>

4.5.24 bdi芁玠

Element/bdi

Support in all current engines.

Firefox10+Safari6+Chrome16+
Opera?Edge79+
Edge (Legacy)?Internet ExplorerNo
Firefox Android?Safari iOS?Chrome Android?WebView Android37+Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
たた、dirグロヌバル属性は、この芁玠で特別なセマンティックスを持぀。
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

bdi芁玠は、双方向テキスト曞匏蚭定の意図に察しおその呚囲から分離されるべきテキストの範囲を衚す。[BIDI]

dirグロヌバル属性は、この芁玠䞊でデフォルトでautoずなる他の芁玠ず同様に、芪芁玠から継承しない。

この芁玠は、双方向アルゎリズムに関わるレンダリング芁件を持぀。

未知の方向ずずもにナヌザヌ生成コンテンツを組み蟌む堎合、この芁玠は特に䟿利である。

この䟋においお、ナヌザヌ名はナヌザヌが送信したポストの数ずずもに衚瀺される。bdi芁玠が䜿甚されなかった堎合、アラビア語ナヌザヌのナヌザヌ名は、テキストの区別が぀かないこずになるだろう双方向アルゎリズムは、コロンず数字"3"の次に単語"posts"よりむしろ単語"User"を眮くだろう。

<ul>
 <li>User <bdi>jcranmer</bdi>: 12 posts.
 <li>User <bdi>hober</bdi>: 5 posts.
 <li>User <bdi>إيان</bdi>: 3 posts.
</ul>
bdi芁玠を䜿甚する堎合、期埅どおりにナヌザヌ名が働く。
bdi芁玠がb芁玠で眮換された堎合、ナヌザヌ名は双方向アルゎリズムを混乱させる可胜性があり、3぀目の黒䞞は、蚀っお終わるだろう、アラビア語の名前右から巊に続いお、"posts"に続き、"User 3 :"ず蚀っお終了する。

4.5.25 bdo芁玠

Element/bdo

Support in all current engines.

Firefox10+Safari4+Chrome15+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
たた、dirグロヌバル属性は、この芁玠で特別なセマンティックスを持぀。
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

bdo芁玠は、その子に察する明瀺的なテキスト方向の曞匏蚭定コントロヌルを衚す。この芁玠は、䜜者が明瀺的に方向の䞊曞きを指定するこずによっお、Unicode双方向アルゎリズムを䞊曞きできる。[BIDI]

著者は、巊から右ぞの䞊曞きを指定する倀ltrず、右から巊ぞの䞊曞きを指定する倀rtlずずもに、この芁玠のdir属性を指定しなければならない。auto倀は指定されおはならない。

この芁玠は、双方向アルゎリズムに関わるレンダリング芁件を持぀。

4.5.26 span芁玠

Element/span

Support in all current engines.

Firefox1+Safari1+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLSpanElement

Support in all current engines.

Firefox1+Safari6+Chrome15+
Opera?Edge79+
Edge (Legacy)12+Internet Explorer5.5+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
パルパブルコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
フレヌゞングコンテンツ。
text/htmlにおけるタグ省略
どちらのタグも省略䞍可。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
[Exposed=Window]
interface HTMLSpanElement : HTMLElement {
  [HTMLConstructor] constructor();
};

span芁玠はそれ自身では䜕の意味もないが、たずえばclass、lang、たたはdirなどのグロヌバル属性ずずもに䜿甚する堎合に圹立぀。この芁玠は、芁玠の子を衚す。

この䟋においお、コヌド断片は、そのキヌワヌドず識別子がCSSで色分けできるように、span芁玠ずclass属性を䜿っおマヌクアップされる

<pre><code class="lang-c"><span class="keyword">for</span> (<span class="ident">j</span> = 0; <span class="ident">j</span> &lt; 256; <span class="ident">j</span>++) {
  <span class="ident">i_t3</span> = (<span class="ident">i_t3</span> & 0x1ffff) | (<span class="ident">j</span> &lt;&lt; 17);
  <span class="ident">i_t6</span> = (((((((<span class="ident">i_t3</span> >> 3) ^ <span class="ident">i_t3</span>) >> 1) ^ <span class="ident">i_t3</span>) >> 8) ^ <span class="ident">i_t3</span>) >> 5) & 0xff;
  <span class="keyword">if</span> (<span class="ident">i_t6</span> == <span class="ident">i_t1</span>)
    <span class="keyword">break</span>;
}</code></pre>

4.5.27 br芁玠

Element/br

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera?Edge79+
Edge (Legacy)12+Internet ExplorerYes
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

HTMLBRElement

Support in all current engines.

Firefox1+Safari3+Chrome1+
Opera12.1+Edge79+
Edge (Legacy)12+Internet Explorer5.5+
Firefox Android?Safari iOS1+Chrome Android?WebView Android?Samsung Internet?Opera Android12.1+
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
Nothing。
text/htmlにおけるタグ省略
終了タグなし。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
[Exposed=Window]
interface HTMLBRElement : HTMLElement {
  [HTMLConstructor] constructor();

  // also has obsolete members
};

br芁玠は改行を衚す。

改行は通垞、埌続のテキストを新しい行ぞ物理的に移動するこずによっお芖芚メディアで衚珟される䞀方で、スタむルシヌトたたはナヌザヌ゚ヌゞェントは、たずえば緑のドットずしお、たたは䜙分な物ずしお、異なる方法でレンダリングされるために改行し぀぀均等に割り付けるかもしれない。

br芁玠は、詩やアドレスのように、実際にコンテンツの䞀郚である改行のためにのみに䜿甚されなければならない。

次の䟋は、br芁玠の正しい䜿い方である

<p>P. Sherman<br>
42 Wallaby Way<br>
Sydney</p>

br芁玠は、段萜でテヌマ別グルヌプを分離するために䜿甚しおはならない。

これらはbr芁玠を濫甚するので、次の䟋は䞍適合である

<p><a ...>34 comments.</a><br>
<a ...>Add a comment.</a></p>
<p><label>Name: <input name="name"></label><br>
<label>Address: <input name="address"></label></p>

これは、䞊蚘の代わりに正しいものである

<p><a ...>34 comments.</a></p>
<p><a ...>Add a comment.</a></p>
<p><label>Name: <input name="name"></label></p>
<p><label>Address: <input name="address"></label></p>

段萜が単䞀のbr芁玠を陀いお䜕も構成しない堎合、プレヌスホルダヌの空癜行をたずえば、テンプレヌト内を衚す。そのような空癜行は、プレれンテヌションの目的に察しお䜿甚しおはならない。

br芁玠内郚のすべおのコンテンツは、呚囲のテキストの䞀郚ずみなされおはならない。

この芁玠は、双方向アルゎリズムに関わるレンダリング芁件を持぀。

4.5.28 wbr芁玠

Element/wbr

Support in all current engines.

Firefox1+Safari4+Chrome1+
Opera11.6+Edge79+
Edge (Legacy)?Internet Explorer5.5–7
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android12+
カテゎリヌ
フロヌコンテンツ。
フレヌゞングコンテンツ。
この芁玠を䜿甚できるコンテキスト
フレヌゞングコンテンツが期埅される堎所。
コンテンツモデル
Nothing。
text/htmlにおけるタグ省略
終了タグなし。
コンテンツ属性
グロヌバル属性
アクセシビリティの考慮
著者向け。
実装者向け。
サニタむれヌション
デフォルト。
DOMむンタヌフェむス
HTMLElementを䜿甚する。

wbr芁玠は改行の機䌚を衚す。

次の䟋においお、効果があるように1぀の長い単語ずしお曞かれる発蚀ずしおある人が匕甚される。しかし、テキストが読める圢に改行されるこずを保蚌するために、匕甚内の個別の単語はwbr芁玠を䜿甚しお分離される。

<p>So then she pointed at the tiger and screamed
"there<wbr>is<wbr>no<wbr>way<wbr>you<wbr>are<wbr>ever<wbr>going<wbr>to<wbr>catch<wbr>me"!</p>

wbr芁玠内郚のすべおのコンテンツは、呚囲のテキストの䞀郚ずみなされおはならない。

var wbr = document.createElement("wbr");
wbr.textContent = "This is wrong";
document.body.appendChild(wbr);

この芁玠は、双方向アルゎリズムに関わるレンダリング芁件を持぀。

4.5.29 䜿甚方法の抂芁

この節は非芏範的である。

芁玠目的䟋
aハむパヌリンク
Visit my <a href="drinks.html">drinks</a> page.
em匷調
I must say I <em>adore</em> lemonade.
strong重芁
This tea is <strong>very hot</strong>.
smallサむドコメント
These grapes are made into wine. <small>Alcohol is addictive.</small>
s正確でないテキスト
Price: <s>£4.50</s> £2.00!
cite䜜品のタむトル
The case <cite>Hugo v. Danielle</cite> is relevant here.
q匕甚文
The judge said <q>You can drink water from the fish tank</q> but advised against it.
dfn定矩䟋
The term <dfn>organic food</dfn> refers to food produced without synthetic chemicals.
abbr略語
Organic food in Ireland is certified by the <abbr title="Irish Organic Farmers and Growers Association">IOFGA</abbr>.
ruby, rt, rpルビ泚釈
<ruby> OJ <rp>(<rt>Orange Juice<rp>)</ruby>
data等䟡な機械可読圢匏
Available starting today! <data value="UPC:022014640201">North Coast Organic Apple Cider</data>
time日付たたは時刻関連デヌタの等䟡な機械可読圢匏
Available starting on <time datetime="2011-11-18">November 18th</time>!
codeコンピュヌタヌコヌド
The <code>fruitdb</code> program can be used for tracking fruit production.
var倉数
If there are <var>n</var> fruit in the bowl, at least <var>n</var>÷2 will be ripe.
sampコンピュヌタヌ出力
The computer said <samp>Unknown error -3</samp>.
kbdナヌザヌ入力
Hit <kbd>F1</kbd> to continue.
sub䞋付き文字
Water is H<sub>2</sub>O.
sup䞊付き文字
The Hydrogen in heavy water is usually <sup>2</sup>H.
i代替音声
Lemonade consists primarily of <i>Citrus limon</i>.
bキヌワヌド
Take a <b>lemon</b> and squeeze it with a <b>juicer</b>.
u泚釈
The mixture of apple juice and <u class="spelling">eldeflower</u> juice is very pleasant.
markハむラむト
Elderflower cordial, with one <mark>part</mark> cordial to ten <mark>part</mark>s water, stands a<mark>part</mark> from the rest.
bdiテキスト方向の分離
The recommended restaurant is <bdi lang="">My Juice Café (At The Beach)</bdi>.
bdoテキスト方向圢匏
The proposal is to write English, but in reverse order. "Juice" would become "<bdo dir=rtl>Juice</bdo>">
spanその他
In French we call it <span lang="fr">sirop de sureau</span>.
br改行
Simply Orange Juice Company<br>Apopka, FL 32703<br>U.S.A.
wbr改行の機䌚
www.simply<wbr>orange<wbr>juice.com