focus-within 是一个 CSS 伪类选择器，它匹配包含某个元素的父元素，当该元素或其任何子元素获得焦点时，该选择器将生效。与 :focus 伪类选择器不同，:focus-within 选择器是基于父元素的状态而不是基于子元素的状态。

例如，以下代码片段中，当用户点击 input 元素时，它的父元素 div 元素会改变背景颜色：

<div class="container">
  <input type="text" placeholder="Enter text">
</div>

.container:focus-within {
  background-color: lightblue;
}

当 input 元素获得焦点时，div 元素的背景颜色将变为 lightblue。

需要注意的是，:focus-within 伪类选择器的浏览器支持性不如其他选择器，例如 :hover 和 :active。

overflow: hidden;

        .clearfix::after {
            content: '';
            clear: both;
            /* 转为块级元素 */
            display: block;
        }

（1）定位属性：position  display  float  left  top  right  bottom   overflow  clear   z-index
（2）自身属性：width  height  padding  border  margin   background
（3）文字样式：font-family   font-size   font-style   font-weight   font-varient   color   
（4）文本属性：text-align   vertical-align   text-wrap   text-transform   text-indent    text-decoration   letter-spacing    word-spacing    white-space   text-overflow
（5）css3中新增属性：content   box-shadow   border-radius  transform……