一、has()选择器
定义：
has()选择器是一款非常强大的选择器。它可以通过后面及里面的元素确定前面或外面的元素的CSS样式。我们根据子元素来为父元素设置样式。
语法：
:has(selector)
实例：
例如，我们可以这样做：
div { background: white; }
div:has(img) { background: red; } //表示当div中有子元素img时，div背景red
div:has(>img){ background: red; } //表示当div中有子元素img时，div背景red
div:has(+img){ background: red; } //表示当div后面紧跟着img时，div背景red
div:has(~img){ background: red; } //表示当div后面有img类型的兄弟元素时，div背景red
效果图：
浏览器支持情况：
尽管has选择器已经作为标准列入w3c中，但是大部分浏览器不支持。 它能支持在
谷歌105版本及以上，火狐目前都不支持。
二、selection()选择器
定义和用法：
::selection选择器匹配元素中被用户选中或处于高亮状态的部分。
::selection只可以应用于少数的CSS属性：color, background, cursor,和outline。
语法：
::selection{}
实例：
::selection
{ //表示将选定文本定义成红色并加粗
color:#ff0000;
font-weight:bold;
}
效果图：
浏览器支持情况：
E9+, Opera, Google Chrome和Safari支持::selection选择器。Firefox 通过其私有属性 ::-moz-selection 支持 。
三、placeholder()选择器
定义和用法：
::placeholder选择器用于选取带有占位符文本的表单元素，并让您设置占位符文本的样式。
占位符文本使用 placeholder 属性设置，这个属性规定描述输入字段期望值的提示文本。
提示： 在大多数浏览器中，占位符文本的默认颜色为浅灰色。
语法：
::placeholder{}
实例：
::placeholder{color:#c00;font-weight: bold;}
:-webkit-input-placeholder { color: #c00;font-weight: bold;}
:-ms-input-placeholder { color: c00;font-weight: bold;}
::placeholder {color: c00;font-weight: bold;}
效果图：
浏览器支持情况：
前端小菜鸟边学习边整理，如有问题欢迎指正，侵删~
