CSS псевдокласс :only-child

Псевдокласс :only-child выбирает единственный дочерний элемент родителя.

Версия

CSS3

Синтаксис

:only-child {
css declarations;
}

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style> 
      p:only-child {
      background: #1c87c9;
      }
    </style>
  </head>
  <body>
    <h2>Пример селектора :only-child</h2>
    <div>
      <p>Lorem Ipsum - это текст-"рыба".</p>
    </div>
    <div>
      <p>Lorem Ipsum - это текст-"рыба".</p>
      <p>Lorem Ipsum - это текст-"рыба".</p>
    </div>
  </body>
</html>

Попробуйте сами!

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


4.0+	12.0+	3.5+	3.2+	10.0+

Практикуйте свои знания

Что такое псевдокласс :only-child в CSS?

Это псевдокласс, который выбирает каждый элемент, который является единственным потомком своего родительского элемента.

Это псевдокласс, который выбирает каждый элемент, который не является единственным потомком своего родительского элемента.

Это псевдокласс, который выбирает каждый элемент, у которого есть хотя бы один потомок.

Это псевдокласс, который выбирает каждый элемент, который является единственным дочерним элементом своего родительского элемента.

❮ Назад Вперед ❯

Считаете ли это полезным?