子孫結合子 (descendant combinator) ― 通常は単一の空白文字 ( ) で表される ― は2つの CSS セレクターを結合し、1つ目のセレクターに一致する要素の子孫のうち、2つ目のセレクターに一致する要素を選択します。子孫結合子を利用したセレクターは子孫セレクターと呼ばれます。

/* "my-things" リストの子孫のリスト項目 */
ul.my-things li {
  margin: 2em;
}

子孫結合子は、技術的には他の結合子がない2つのセレクターの間にある1つ以上の CSS ホワイトスペース文字 ― 空白文字や4種類の制御文字 (復帰、ページ送り、改行、タブ文字) のうちの1つ ― です。さらに、結合子としてのホワイトスペース文字には任意の数の CSS コメントを含めることができます。

構文

セレクター1 セレクター2 {
  /* プロパティ宣言 */
}

CSS

li {
  list-style-type: disc;
}

li li {
  list-style-type: circle;
}

HTML

<ul>
  <li>
    <div>Item 1</div>
    <ul>
      <li>Subitem A</li>
      <li>Subitem B</li>
    </ul>
  </li>
  <li>
    <div>Item 2</div>
    <ul>
      <li>Subitem A</li>
      <li>Subitem B</li>
    </ul>
  </li>
</ul>

結果

仕様書

仕様書 状態 備考
Selectors Level 4
descendant combinator の定義
草案  
Selectors Level 3
descendant combinator の定義
勧告  
CSS Level 2 (Revision 1)
descendant selectors の定義
勧告  
CSS Level 1
contextual selectors の定義
勧告 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
Descendant combinator (A B)Chrome 完全対応 1
完全対応 1
完全対応 61
補足
補足 >>> is aliased to this selector since its use as the 'shadow-piercing descendant combinator' was deprecated.
Edge 完全対応 12Firefox 完全対応 1IE 完全対応 3Opera 完全対応 ありSafari 完全対応 1WebView Android 完全対応 ありChrome Android 完全対応 18
完全対応 18
完全対応 61
補足
補足 >>> is aliased to this selector since its use as the 'shadow-piercing descendant combinator' was deprecated.
Firefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 1Samsung Internet Android 完全対応 1.0
A >> B syntax
非推奨
Chrome 未対応 なしEdge 未対応 なしFirefox 未対応 なしIE 未対応 なしOpera 未対応 なしSafari 未対応 10 — 11.1WebView Android 未対応 なしChrome Android 未対応 なしFirefox Android 未対応 なしOpera Android 未対応 なしSafari iOS 未対応 10 — 11.1Samsung Internet Android 未対応 なし

凡例

完全対応  
完全対応
未対応  
未対応
非推奨。新しいウェブサイトでは使用しないでください。
非推奨。新しいウェブサイトでは使用しないでください。
実装ノートを参照してください。
実装ノートを参照してください。

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, mdnwebdocs-bot, ethertank, sosleepy
最終更新者: mfuji09,