# CSS - :has() 一種 "父級" 選擇器

CSS 中的 `:has()` 是一種可以透過子級元素來限定父級元素的選擇器。一般來說在選擇元素的時候，都是從最上層父級慢慢往下指定：`.class1 > .class2 #id`。
`:has()` 則是反過來

```css
/* Matches <a> elements that contain an <img> child */
a:has(img) { … }

/* Matches <a> elements that directly contain an <img> child */
a:has(> img) { … }

/* Matches <section> elements that don’t contain any heading elements: */
section:not(:has(h1, h2, h3, h4, h5, h6))
```

Reference：
- https://www.bram.us/2021/12/21/the-css-has-selector-is-way-more-than-a-parent-selector/