:only-child

Описание

CSS псевдокласс :only-child находит любой элемент, являющийся единственным потомком родителя. Это тоже, что и :first-child:last-child или :nth-child(1):nth-last-child(1), но с меньшей специфичностью.

Синтаксис

parent child:only-child {
  property: value;
} 

Примеры

Простой пример

span:only-child {
  color: red;
}
<div>
  <span>Этот span единственный ребёнок своего папы:(</span>
</div>

<div>
  <span>Этот span один из потомков родителя</span>
  <span>Этот span один из детей отца</span>
</div> 

Результат

Пример со списком

li li {
  list-style-type: disc;
}
li:only-child {
  color: #6699ff;
  font-style: italic;
  list-style-type: square;
}
<ol>
  <li>Первый
    <ul>
      <li>Это единственный ребёнок
    </ul>
  </li>
  <li>Второй
    <ul>
      <li>Этот список с двумя элементами
      <li>Этот список с двумя элементами
    </ul>
  </li>
  <li>Третий
    <ul>
      <li>Этот список с тремя элементами
      <li>Этот список с тремя элементами
      <li>Этот список с тремя элементами
    </ul>
  </li>
<ol>

Результат

Спецификации

Спецификация Статус Комментарий
Selectors Level 4
Определение ':only-child' в этой спецификации.
Рабочий черновик Без изменений
Selectors Level 3
Определение ':only-child' в этой спецификации.
Рекомендация Изначальное определение

Поддержка браузерами

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
:only-childChrome Полная поддержка 2Edge Полная поддержка 12Firefox Полная поддержка 1.5IE Полная поддержка 9Opera Полная поддержка 9.5Safari Полная поддержка 3.1WebView Android Полная поддержка ≤37Chrome Android Полная поддержка 18Firefox Android Полная поддержка 4Opera Android Полная поддержка 10.1Safari iOS Полная поддержка 3.1Samsung Internet Android Полная поддержка 1.0
Matches elements with no parentChrome Полная поддержка 57Edge Полная поддержка 79Firefox Полная поддержка 52IE Нет поддержки НетOpera Полная поддержка 44Safari Нет поддержки НетWebView Android Полная поддержка 57Chrome Android Полная поддержка 57Firefox Android Полная поддержка 52Opera Android Полная поддержка 43Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 7.0

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки