1.选中父元素的input框聚焦

        focus-within，普通的focus只适用于input框， focus-within给input框的父元素设置，可以设置聚焦时父元素的样式设置

2.常用于表单必填项星号设置

        以前都是直接使用<span>*</span>然后设置样式，这样维护很麻烦，可以使用简单的，has属性

        1.给需要必填的input框设置自定义data-required属性，选中span后面的input包含data-required的，设置伪元素内容为*

<span>姓名</span><input data-required type="text" name="name" id="name" placeholder="Enter your name">span:has(+input[data-required])::after {content: "*";color: red;}

3.文本选择区域

        文本选中之后，给他加粗或者是背景色，可以使用伪元素，::selection