:has() Selector
CSS :has() Relational Pseudo-class
A parent selector that matches elements containing descendants matching a given selector, enabling upward DOM selection.
Техническая деталь
CSS :has() Selectors require a containment context declared with container-type: inline-size on the parent element. The @container rule then queries the container's dimensions rather than the viewport. Container query units (cqw, cqh, cqi, cqb) resolve relative to the query container. This enables truly reusable components that adapt to their available space regardless of viewport size — solving the long-standing limitation of media queries in component-based architectures.
Пример
```css
/* Example: :has() Selector */
.element {
/* Apply has selector to this element */
display: block;
margin: 0 auto;
}
```
Связанные инструменты
М
Минификатор CSS
Ф
Форматирование CSS
Г
Генератор CSS-градиентов
Г
Генератор CSS Box Shadow
Г
Генератор CSS Flexbox
Г
Генератор CSS Grid
Г
Генератор CSS-анимаций
Г
Генератор CSS Border Radius
Г
Генератор CSS Text Shadow
Г
Генератор CSS Transform
C
CSS Unit Converter
C
CSS Color Converter
M
Media Query Generator
C
CSS Filter Effects
C
CSS Clip-Path Generator