HTML

Living Standard — Last Updated 1 September 2026

1. 1. 4.14 専用要素なしの一般的語彙
      1. 4.14.1 パンくずナビゲーション
      2. 4.14.2 タグクラウド
      3. 4.14.3 会話
      4. 4.14.4 脚注
   2. 4.15 無効要素
   3. 4.16 セレクターを用いたHTML要素のマッチング
      1. 4.16.1 Case-sensitivity of the CSS 'attr()' function
      2. 4.16.2 Case-sensitivity of selectors
      3. 4.16.3 疑似クラス

4.14 専用要素なしの一般的語彙

4.14.1 パンくずナビゲーション

この仕様は、パンくずナビゲーションメニューを記述する機械可読な方法を提供しない。著者は単に段落で一連のリンクを使用するよう推奨される。nav要素は、ナビゲーションブロックであるとして、これらの段落を含むセクションをマークするために使用できる。

<nav>
 <p>
  <a href="/">Main</a> ▸
  <a href="/products/">Products</a> ▸
  <a href="/products/dishwashers/">Dishwashers</a> ▸
  <a>Second hand</a>
 </p>
 <p>
  <a href="/">Main</a> ▸
  <a href="/second-hand/">Second hand</a> ▸
  <a>Dishwashers</a>
 </p>
</nav>

4.14.2 タグクラウド

この仕様は、ページのグループ（タグクラウドとも呼ばれる）に適用するキーワードのリストをマークアップするための特別な任意のマークアップを定義しない。一般に著者は、非表示およびスタイルシートを使って見栄え効果をだす明示的なインラインのカウントをもつul要素を使用してこのようなリストをマークアップする、またはSVGを使用することのいずれかを推奨される。

<style>
.tag-cloud > li > span { display: none; }
.tag-cloud > li { display: inline; }
.tag-cloud-1 { font-size: 0.7em; }
.tag-cloud-2 { font-size: 0.9em; }
.tag-cloud-3 { font-size: 1.1em; }
.tag-cloud-4 { font-size: 1.3em; }
.tag-cloud-5 { font-size: 1.5em; }

@media speech {
  .tag-cloud > li > span { display:inline }
}
</style>
...
<ul class="tag-cloud">
 <li class="tag-cloud-4"><a title="28 instances" href="/t/apple">apple</a> <span>(popular)</span>
 <li class="tag-cloud-2"><a title="6 instances"  href="/t/kiwi">kiwi</a> <span>(rare)</span>
 <li class="tag-cloud-5"><a title="41 instances" href="/t/pear">pear</a> <span>(very popular)</span>
</ul>

4.14.3 会話

この仕様は、ミーティング議事録、チャット記録、脚本における対話、インスタントメッセージログ、および様々なプレーヤーが交代で談話する他の状況を満たし、会話をマークアップするための特定の要素を定義しない。

代わりに、著者はp要素や句読点を使って会話をマークアップすることを推奨する。スタイリング目的のために話者をマークする必要がある著者は、spanまたはbを使用するよう推奨される。i要素に包まれたテキストを含む段落は、ト書きをマークアップするために使用できる。

<p> Costello: Look, you gotta first baseman?
<p> Abbott: Certainly.
<p> Costello: Who's playing first?
<p> Abbott: That's right.
<p> Costello becomes exasperated.
<p> Costello: When you pay off the first baseman every month, who gets the money?
<p> Abbott: Every dollar of it.

<p> <data value="1319898155">14:22</data> <b>egof</b> I'm not that nerdy, I've only seen 30% of the star trek episodes
<p> <data value="1319898192">14:23</data> <b>kaj</b> if you know what percentage of the star trek episodes you have seen, you are inarguably nerdy
<p> <data value="1319898200">14:23</data> <b>egof</b> it's unarguably
<p> <data value="1319898228">14:23</data> <i>* kaj blinks</i>
<p> <data value="1319898260">14:24</data> <b>kaj</b> you are not helping your case

<p> Next, you meet a fisher. You can say one of several greetings:
<dl>
 <dt> "Hello there!"
 <dd>
  <p> She responds with "Hello, how may I help you?"; you can respond with:
  <dl>
   <dt> "I would like to buy a fish."
   <dd> <p> She sells you a fish and the conversation finishes.
   <dt> "Can I borrow your boat?"
   <dd>
    <p> She is surprised and asks "What are you offering in return?".
    <dl>
     <dt> "Five gold." (if you have enough)
     <dt> "Ten gold." (if you have enough)
     <dt> "Fifteen gold." (if you have enough)
     <dd> <p> She lends you her boat. The conversation ends.
     <dt> "A fish." (if you have one)
     <dt> "A newspaper." (if you have one)
     <dt> "A pebble." (if you have one)
     <dd> <p> "No thanks", she replies. Your conversation options
     at this point are the same as they were after asking to borrow
     her boat, minus any options you've suggested before.
    </dl>
   </dd>
  </dl>
 </dd>
 <dt> "Vote for me in the next election!"
 <dd> <p> She turns away. The conversation finishes.
 <dt> "Madam, are you aware that your fish are running away?"
 <dd>
  <p> She looks at you skeptically and says "Fish cannot run, miss".
  <dl>
   <dt> "You got me!"
   <dd> <p> The fisher sighs and the conversation ends.
   <dt> "Only kidding."
   <dd> <p> "Good one!" she retorts. Your conversation options at this
   point are the same as those following "Hello there!" above.
   <dt> "Oh, then what are they doing?"
   <dd> <p> She looks at her fish, giving you an opportunity to steal
   her boat, which you do. The conversation ends.
  </dl>
 </dd>
</dl>

<section>
 <h1>Dialogue</h1>
 <p><small>Some characters repeat their lines in order each time you interact
 with them, others randomly pick from amongst their lines. Those who respond in
 order have numbered entries in the lists below.</small>
 <h2>The Shopkeeper</h2>
 <ul>
  <li>How may I help you?
  <li>Fresh apples!
  <li>A loaf of bread for madam?
 </ul>
 <h2>The pilot</h2>
 <p>Before the accident:
 <ul>
  <li>I'm about to fly out, sorry!
  <li>Sorry, I'm just waiting for flight clearance and then I'll be off!
 </ul>
 <p>After the accident:
 <ol>
  <li>I'm about to fly out, sorry!
  <li>Ok, I'm not leaving right now, my plane is being cleaned.
  <li>Ok, it's not being cleaned, it needs a minor repair first.
  <li>Ok, ok, stop bothering me!Truth is, I had a crash.
 </ol>
 <h2>Clan Leader</h2>
 <p>During the first clan meeting:
 <ul>
  <li>Hey, have you seen my daughter?I bet she's up to something nefarious again...
  <li>Nice weather we're having today, eh?
  <li>The name is Bailey, Jeff Bailey. How can I help you today?
  <li>A glass of water?Fresh from the well!
 </ul>
 <p>After the earthquake:
 <ol>
  <li>Everyone is safe in the shelter, we just have to put out the fire!
  <li>I'll go and tell the fire brigade, you keep hosing it down!
 </ol>
</section>

4.14.4 脚注

HTMLは、脚注をマークアップするための専用のメカニズムを持たない。ここで提案する選択肢がある。

短いインライン注釈の場合、title属性を使用することができる。

<p> <b>Customer</b>: Hello! I wish to register a complaint. Hello. Miss?
<p> <b>Shopkeeper</b>: <span title="Colloquial pronunciation of 'What do you'"
>Watcha</span> mean, miss?
<p> <b>Customer</b>: Uh, I'm sorry, I have a cold. I wish to make a complaint.
<p> <b>Shopkeeper</b>: Sorry, <span title="This is, of course, a lie.">we're
closing for lunch</span>.

不幸なことに、title属性に依存することは、多くのユーザーエージェントがこの仕様で要求されるようなアクセス可能な方法で属性を公開しないため、現在推奨されない（たとえば、ツールチップを出現させるマウスなどのポインティングデバイスが必要になり、これはモダンな携帯端末やタブレットをもつ人のような、キーボードのみのユーザーとタッチのみのユーザーを締め出す）。

title属性が使用される場合、属性をもつ要素への読者の関心を引き出すためにCSSを使用することができる。

[title] { border-bottom: thin dashed; }

より長い注釈の場合、後で文書の要素を指すよう、a要素が使用されるべきである。リンクのコンテンツが角括弧内の数字であるのが慣例である。

<p> Announcer: Number 16: The <i>hand</i>.
<p> Interviewer: Good evening. I have with me in the studio tonight
Mr Norman St John Polevaulter, who for the past few years has been
contradicting people. Mr Polevaulter, why <em>do</em> you
contradict people?
<p> Norman: I don't. <sup><a href="#fn1" id="r1">[1]</a></sup>
<p> Interviewer: You told me you did!
...
<section>
 <p id="fn1"><a href="#r1">[1]</a> This is, naturally, a lie,
 but paradoxically if it were true he could not say so without
 contradicting the interviewer and thus making it false.</p>
</section>

サイドノートに対して、単に特定の単語や文よりもテキストのセクション全体に適用されるより長い注釈の場合、aside要素を使用すべきである。

<p> <span class="speaker">Customer</span>: I will not buy this record, it is scratched.
<p> <span class="speaker">Shopkeeper</span>: I'm sorry?
<p> <span class="speaker">Customer</span>: I will not buy this record, it is scratched.
<p> <span class="speaker">Shopkeeper</span>: No no no, this's'a tobacconist's.
<aside>
 <p>In 1970, the British Empire lay in ruins, and foreign
 nationalists frequented the streets — many of them Hungarians
 (not the streets — the foreign nationals). Sadly, Alexander
 Yalt has been publishing incompetently-written phrase books.
</aside>

図または表について、脚注は該当figcaptionまたはcaption要素、または文の周囲に含めることができる。

<figure>
 <figcaption>Table 1. Alternative activities for knights.</figcaption>
 <table>
  <tr>
   <th> Activity
   <th> Location
   <th> Cost
  <tr>
   <td> Dance
   <td> Wherever possible
   <td> £0<sup><a href="#fn1">1</a></sup>
  <tr>
   <td> Routines, chorus scenes<sup><a href="#fn2">2</a></sup>
   <td> Undisclosed
   <td> Undisclosed
  <tr>
   <td> Dining<sup><a href="#fn3">3</a></sup>
   <td> Camelot
   <td> Cost of ham, jam, and spam<sup><a href="#fn4">4</a></sup>
 </table>
 <p id="fn1">1. Assumed.</p>
 <p id="fn2">2. Footwork impeccable.</p>
 <p id="fn3">3. Quality described as "well".</p>
 <p id="fn4">4. A lot.</p>
</figure>

4.15 無効要素

この定義は、どの要素がフォーカス可能であるか、ならびにどの要素が:enabledおよび:disabled疑似クラスと一致するかを決定するために使用される。

4.16 セレクターを用いたHTML要素のマッチング

4.16.1 Case-sensitivity of the CSS 'attr()' function

CSS Values and Units leaves the case-sensitivity of attribute names for the purpose of the 'attr()' function to be defined by the host language. [CSSVALUES]

When comparing the attribute name part of a CSS 'attr()' function to the names of namespace-less attributes on HTML elements in HTML documents, the name part of the CSS 'attr()' function must first be converted to ASCII lowercase. The same function when compared to other attributes must be compared according to its original case. In both cases, to match, the values must be identical to each other (and therefore the comparison is case sensitive).

This is the same as comparing the name part of a CSS attribute selector, specified in the next section.

4.16.2 Case-sensitivity of selectors

Selectors leaves the case-sensitivity of element names, attribute names, and attribute values to be defined by the host language. [SELECTORS]

When comparing a CSS element type selector to the names of HTML elements in HTML documents, the CSS element type selector must first be converted to ASCII lowercase. The same selector when compared to other elements must be compared according to its original case. In both cases, to match, the values must be identical to each other (and therefore the comparison is case sensitive).

When comparing the name part of a CSS attribute selector to the names of attributes on HTML elements in HTML documents, the name part of the CSS attribute selector must first be converted to ASCII lowercase. The same selector when compared to other attributes must be compared according to its original case. In both cases, the comparison is case-sensitive.

Attribute selectors on an HTML element in an HTML document must treat the values of attributes with the following names as ASCII case-insensitive:

• accept
• accept-charset
• align
• alink
• axis
• bgcolor
• charset
• checked
• clear
• codetype
• color
• compact
• declare
• defer
• dir
• direction
• disabled
• enctype
• face
• frame
• hreflang
• http-equiv
• lang
• language
• link
• media
• method
• multiple
• nohref
• noresize
• noshade
• nowrap
• readonly
• rel
• rev
• rules
• scope
• scrolling
• selected
• shape
• target
• text
• type
• valign
• valuetype
• vlink

All other attribute values and everything else must be treated as entirely identical to each other for the purposes of selector matching. これは次を含む：

• IDs and classes in no-quirks mode and limited-quirks mode

• the names of elements not in the HTML namespace

• the names of HTML elements in XML documents

• the names of attributes of elements not in the HTML namespace

• the names of attributes of HTML elements in XML documents

• the names of attributes that themselves have namespaces

Selectors defines that ID and class selectors (such as #foo and .bar), when matched against elements in documents that are in quirks mode, will be matched in an ASCII case-insensitive manner. However, this does not apply for attribute selectors with "id" or "class" as the name part. The selector [class="foobar"] will treat its value as case-sensitive even in quirks mode.

4.16.3 疑似クラス

HTMLと一緒に使用することができる多数の動的セレクターが存在する。このセレクターがHTML要素とマッチする場合に、このセクションは定義する。[SELECTORS] [CSSUI]

:defined

✔MDN

:defined

Support in all current engines.

Firefox63+Safari10+Chrome54+

---

Opera?Edge79+

---

Edge (Legacy)?Internet ExplorerNo

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

:defined疑似クラス は、definedである任意の要素とマッチしなければならない。

:link

✔MDN

:link

Support in all current engines.

Firefox1+Safari1+Chrome1+

---

Opera3.5+Edge79+

---

Edge (Legacy)12+Internet Explorer3+

---

Firefox Android?Safari iOS3.2+Chrome Android?WebView Android1.5+Samsung Internet?Opera Android?

:visited

✔MDN

:visited

Support in all current engines.

Firefox1+Safari1+Chrome1+

---

Opera3.5+Edge79+

---

Edge (Legacy)12+Internet Explorer4+

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android10.1+

href属性を持つすべてのa要素、およびhref属性を持つすべてのarea要素は、:linkと:visitedのいずれかとマッチしなければならない。

他の仕様では、この要件の直接的な実装に適用されるプライバシーの懸念を軽減するために、これらの要素がこれら疑似クラスとどのように一致するかに関して、より具体的な規則を適用する場合がある。

:active

✔MDN

:active

Support in all current engines.

Firefox1+Safari1+Chrome1+

---

Opera5+Edge79+

---

Edge (Legacy)12+Internet Explorer4+

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android10.1+

要素がユーザーによってアクティブにされている間:active疑似クラスは要素にマッチするように定義される。

特定の要素が:active疑似クラスのみを定義する目的のためにアクティブにされているかどうかを判断するために、HTMLユーザーエージェントは、次のリストで最初の該当するエントリーを使用しなければならない。

要素がbutton要素がある場合

要素がtype属性が送信ボタン、イメージボタン、リセットボタンまたはボタン状態であるinput要素である場合

要素がhref属性を持つa要素である場合

要素がhref属性を持つarea要素である場合

要素がフォーカス可能である場合

要素が正式なアクティブ化状態にある場合、要素はアクティブにされている。

たとえば、ユーザーがスペースバーを押すことでbutton要素を押すためにキーボードを使用している場合、要素は、要素がkeydownイベントを受信した時刻と要素がkeyupイベントを受信した時刻との間でこの疑似クラスとマッチする。

要素がbeing actively pointed atである場合

要素はアクティブにされている。

要素は、ユーザーがその要素の起動動作をトリガーする意図を示し始めた時点から、ユーザーがその要素の起動動作をトリガーする意図を示すのをやめた時点、またはその要素の起動動作の実行が終了した時点のいずれか早い方までの間、正式な起動状態にあるといわれる。

An element is said to be being actively pointed at while the user indicates the element using a pointing device while that pointing device is in the "down" state (e.g. for a mouse, between the time the mouse button is pressed and the time it is released; for a finger in a multitouch environment, while the finger is touching the display surface).

Selectorsの定義によると、:activeはアクティブにされている要素のフラットツリー祖先にもマッチする。[SELECTORS]

さらに、現在:activeにマッチしているlabel要素のラベル付きコントロールである要素は、:activeにもマッチする。（ただし、アクティブ化されているとはカウントされない。）

:hover

✔MDN

:hover

Support in all current engines.

Firefox1+Safari2+Chrome1+

---

Opera4+Edge79+

---

Edge (Legacy)12+Internet Explorer4+

---

Firefox Android?Safari iOS1+Chrome Android?WebView Android?Samsung Internet?Opera Android10.1+

:hover疑似クラスは、ユーザーがポインティングデバイスで要素を指定する間の要素とマッチするように定義される。:hover疑似クラスのみを定義する目的では、HTMLユーザーエージェントは、ユーザーがポインティングデバイスを使用して指定する要素である場合、その要素をユーザーが 指定するものと見なさなければならない。

Selectorsの定義によると、:hoverは指定された要素のフラットツリー祖先にもマッチする。[SELECTORS]

さらに、現在:hoverにマッチしているlabel要素のラベル付きコントロールである要素は、:hoverにもマッチする。（ただし、指定されるとはカウントされない。）

具体的に、このような断片を考えてみる：

<p> <label for=c> <input id=a> </label> <span id=b> <input id=c> </span> </p>

ユーザーがポインティングデバイスとともにID"a"をもつ要素を指定する場合、p要素（および上記の断片で示されない要素のすべての祖先）、label要素、ID"a"をもつ要素、およびID"c"をもつ要素は:hover疑似クラスとマッチする。IDが"a"の要素は、指定されるであることによってマッチする。label要素とp要素は、Selectorsのフラットツリーの祖先に関する条件のためにマッチする。IDが"c"の要素は、ラベル付きコントロールに関する上記の追加条件を通してマッチする（つまり、そのlabel要素は、:hoverにマッチする）。しかし、ID "b"をもつ要素は:hoverとマッチしない。たとえそれが:hover.とマッチしても、そのフラットツリー子孫は指定されない。

:focus

✔MDN

:focus

Support in all current engines.

Firefox1+Safari1+Chrome1+

---

Opera7+Edge79+

---

Edge (Legacy)12+Internet Explorer8+

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android10.1+

CSS :focus疑似クラスの目的上、次の場合に要素がフォーカスを持つ：

• それ自身がナビゲート可能なコンテナーではない、かつ

• 次のいずれかに該当する：

  • トップレベルの横断可能な現在のフォーカスチェーンにリストされている要素の一つである。または、

  • そのシャドウルートshadowRootがnullではなく、かつ、shadowRootがフォーカスを持つ少なくとも1つの要素のrootである。

:target

✔MDN

:target

Support in all current engines.

Firefox1+Safari1.3+Chrome1+

---

Opera9.5+Edge79+

---

Edge (Legacy)12+Internet Explorer9+

---

Firefox Android?Safari iOS2+Chrome Android?WebView Android2+Samsung Internet?Opera Android10.1+

CSS :target疑似クラスの目的上、Documentのtarget elementsは、nullでない場合Documentのtarget elementはそれを含むリストであり、nullの場合は要素を含まないリストである。[SELECTORS]

:popover-open

✔MDN

:popover-open

Support in all current engines.

Firefox🔰 114+Safaripreview+Chrome114+

---

Opera?Edge114+

---

Edge (Legacy)?Internet ExplorerNo

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

The :popover-open pseudo-class is defined to match any HTML element whose popover attribute is not in the No Popover state and whose popover visibility state is showing.

:enabled

✔MDN

:enabled

Support in all current engines.

Firefox1+Safari3.1+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)12+Internet Explorer9+

---

Firefox Android?Safari iOS?Chrome Android?WebView Android2+Samsung Internet?Opera Android10.1+

:enabled疑似クラスは、実際には無効になっていないbutton、input、select、textarea、optgroup、option、fieldset要素、またはフォームに関連付けられた要素とマッチしなければならない。

:disabled

✔MDN

:disabled

Support in all current engines.

Firefox1+Safari3.1+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)12+Internet Explorer9+

---

Firefox Android?Safari iOS?Chrome Android?WebView Android2+Samsung Internet?Opera Android10.1+

:disabled疑似クラスは、実際に無効である任意の要素とマッチしなければならない。

:checked

✔MDN

:checked

Support in all current engines.

Firefox1+Safari3.1+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)12+Internet Explorer9+

---

Firefox Android4+Safari iOS?Chrome Android18+WebView Android2+Samsung Internet?Opera Android10.1+

:checked疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない。

• type属性がチェックボックス状態にありかつcheckedness状態がtrueであるinput要素
• type属性がラジオボタン状態にありかつcheckedness状態がtrueであるinput要素
• selectednessがtrueであるoption要素

:indeterminate

✔MDN

:indeterminate

Support in all current engines.

Firefox2+Safari3+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)12+Internet Explorer10+

---

Firefox Android?Safari iOS1+Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:indeterminate疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない。

• input elements whose type attribute is in the Checkbox state and whose indeterminateness is true
• type属性がラジオボタン状態でありかつラジオボタングループがcheckedness状態がtrueであるinput要素を含まないinput要素。
• valueコンテンツ属性をもたないprogress要素

:default

✔MDN

:default

Support in all current engines.

Firefox4+Safari5+Chrome10+

---

Opera10+Edge79+

---

Edge (Legacy)?Internet ExplorerNo

---

Firefox Android?Safari iOS5+Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:default疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• フォーム所有者のデフォルトのボタンである送信ボタン。
• checked属性が適用されかつchecked属性を持つinput要素
• selected属性を持つoption要素

:placeholder-shown

:placeholder-shown疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• 現在ユーザーに値が表示されているplaceholder属性を持つinput要素
• 現在ユーザーに値が表示されているplaceholder属性を持つtextarea要素

:valid

✔MDN

:valid

Support in all current engines.

Firefox4+Safari5+Chrome10+

---

Opera10+Edge79+

---

Edge (Legacy)12+Internet Explorer10+

---

Firefox Android?Safari iOS5+Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:valid疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• 制約検証の候補でありかつ制約を満たす要素
• 自身が制約検証の候補であるが制約を満たさない任意の要素のフォーム所有者ではないform要素
• 自身が制約検証の候補であるが制約を満たさない子孫要素を持たないfieldset要素

:invalid

✔MDN

:invalid

Support in all current engines.

Firefox4+Safari5+Chrome10+

---

Opera10+Edge79+

---

Edge (Legacy)12+Internet Explorer10+

---

Firefox Android?Safari iOS5+Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:invalid疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• 制約検証の候補であるが制約を満たさない要素
• 自身が制約検証の候補であるが制約を満たさない1つ以上の要素のフォーム所有者ではないform要素
• 自身が制約検証の候補であるが制約を満たさない1つ以上の子孫要素を持つfieldset要素

:user-valid

:user-valid疑似クラス は、user validityがtrueである input、textarea、およびselect要素とマッチしなければならない。これらの要素は、制約検証の候補であり、制約を満たさなければならない。

:user-invalid

:user-invalid疑似クラス は、user validityがtrueである input、textarea、およびselect要素とマッチしなければならない。これらの要素は、制約検証の候補でであるが、制約を満たしてはならない。

:in-range

✔MDN

:in-range

Support in all current engines.

Firefox29+Safari5.1+Chrome10+

---

Opera11+Edge79+

---

Edge (Legacy)13+Internet ExplorerNo

---

Firefox Android16+Safari iOS?Chrome Android?WebView Android2.2+Samsung Internet1.0+Opera Android11+

:in-range疑似クラスは、制約検証の候補であり、範囲に制限があり、アンダーフローに苦しまずオーバーフローに苦しまない、すべての要素とマッチしなければならない。

:out-of-range

✔MDN

:out-of-range

Support in all current engines.

Firefox29+Safari5.1+Chrome10+

---

Opera11+Edge79+

---

Edge (Legacy)13+Internet ExplorerNo

---

Firefox Android16+Safari iOS?Chrome Android?WebView Android2.2+Samsung Internet?Opera Android11+

:out-of-range疑似クラスは、制約検証の候補であり、範囲に制限があり、アンダーフローに苦しむまたはオーバーフローに苦しむかのいずれかであるすべての要素とマッチしなければならない。

:required

✔MDN

:required

Support in all current engines.

Firefox4+Safari5+Chrome10+

---

Opera10+Edge79+

---

Edge (Legacy)12+Internet Explorer10+

---

Firefox Android?Safari iOS5+Chrome Android?WebView Android4.4.3+Samsung Internet?Opera Android10.1+

:required疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• requiredであるinput要素
• required属性を持つselect要素
• required属性を持つtextarea要素

:optional

✔MDN

:optional

Support in all current engines.

Firefox4+Safari5+Chrome10+

---

Opera10+Edge79+

---

Edge (Legacy)12+Internet Explorer10+

---

Firefox Android?Safari iOS5+Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:optional疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• requiredでないrequired要素が適用するinput要素
• required属性を持たないselect要素
• required属性を持たないtextarea要素

:autofill

MDN

:autofill

Firefox86+Safari15+Chrome🔰 1+

---

Opera?Edge🔰 79+

---

Edge (Legacy)?Internet ExplorerNo

---

Firefox Android?Safari iOS15+Chrome Android?WebView Android?Samsung Internet?Opera Android?

:-webkit-autofill

:autofillおよび:-webkit-autofill疑似クラスは、 ユーザーエージェントによって自動入力されinput要素とマッチしなければならない。ユーザーが自動入力フィールドを編集した場合、これらの疑似クラスはマッチングを停止しなければならない。

そのような自動入力が発生するかもしれないひとつの方法は、autocomplete属性によるものだが、ユーザーエージェントはこの属性が含まれていなくても自動入力できる。

:read-only

✔MDN

:read-only

Support in all current engines.

Firefox78+Safari4+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)13+Internet ExplorerNo

---

Firefox Android🔰 4+Safari iOS?Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:read-write

✔MDN

:read-write

Support in all current engines.

Firefox78+Safari4+Chrome1+

---

Opera9+Edge79+

---

Edge (Legacy)13+Internet ExplorerNo

---

Firefox Android🔰 4+Safari iOS?Chrome Android?WebView Android37+Samsung Internet?Opera Android10.1+

:read-write疑似クラスは、セレクターの目的のためにユーザー変更可能とみなされる、次のカテゴリーの1つに分類される任意の要素とマッチしなければならない：[SELECTORS]

• input elements to which the readonly attribute applies, and that are mutable (i.e. that do not have the readonly attribute specified and that are not disabled)
• readonly属性を持たず、かつ無効でないtextarea要素
• 編集ホストまたは編集可能である要素でかつ、input要素でもtextarea要素でもない要素

:read-only疑似クラスは、他のすべてのHTML要素とマッチしなければならない。

:modal

:modal疑似クラスは、次のカテゴリーのいずれかに分類される任意の要素とマッチしなければならない：

• is modalがtrueであるdialog要素
• フルスクリーンフラグがtrueである要素

:dir(ltr)

MDN

:dir

Firefox49+Safari16.4+ChromeNo

---

Opera?EdgeNo

---

Edge (Legacy)?Internet ExplorerNo

---

Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android?

:dir(ltr)疑似クラスは、書字方向が'ltr'であるすべての要素とマッチしなければならない。

:dir(rtl)

:dir(rtl)疑似クラスは、書字方向が'rtl'であるすべての要素とマッチしなければならない。

カスタム状態疑似クラス

:state(identifier)疑似クラスは、状態セットのセットエントリーに識別子が含まれているすべてのカスタム要素にマッチしなければならない。

:heading

The :heading pseudo-class must match all h1, h2, h3, h4, h5, and h6 elements.

:heading(integer#)

The :heading(integer#) pseudo-class must match all h1, h2, h3, h4, h5, and h6 elements that have a heading level of integer. [CSSSYNTAX] [CSSVALUES]

:playing

:playing疑似クラスは、paused属性がfalseであるすべての メディア要素にマッチしなければならない。

:paused

:paused疑似クラスは、paused属性がtrueであるすべての メディア要素にマッチしなければならない。

:seeking

:seeking疑似クラスは、seeking属性がtrueであるすべての メディア要素にマッチしなければならない。

:buffering

:buffering疑似クラスは、paused属性がfalseであり、 networkState属性がNETWORK_LOADINGであり、かつready状態が HAVE_CURRENT_DATA以下であるすべてのメディア要素にマッチしなければならない。

:stalled

:stalled疑似クラスは、buffering疑似クラスにマッチし、is currently stalledがtrueであるすべてのメディア要素にマッチしなければならない。

This pseudo-class is intended for displaying player state UI when video playback has been buffering for too long. Unlike the stalled event, which fires whenever the network download has stalled regardless of playback or ready state.

:muted

:muted疑似クラスは、mutedであるすべてのメディア要素にマッチしなければならない。

:volume-locked

:volume-locked疑似クラスは、ユーザーエージェントのvolume lockedがtrueであるとき、すべてのメディア要素にマッチしなければならない。

:open

:open疑似クラスは、次のカテゴリーのいずれかに該当する任意の要素とマッチしなければならない：

• open属性を持つdetails要素

• open属性を持つdialog要素

• ドロップダウンボックスであり、そのドロップダウンボックスが開いているselect要素

• ピッカーをサポートし、ピッカーが開いているinput要素

この仕様では、要素が:lang()動的疑似クラスとマッチする場合を定義していない。これは、Selectorsで言語に依存しない流儀で十分に詳細に定義されるためである。[SELECTORS]