Helloworld
1.基础选择器在讲高级选择器之前，我们先来回顾一下CSS中的基础选择器。1.元素选择器最常见的CSS选择器是元素选择器。选择器通常是一个HTML元素：h1{color:red;font-size:50px;}在W3C标准中，元素选择器也称为类型选择器。类型选择器匹配文档语言元素类型的名称。类型选择器匹配文档树中该元素类型的每个实例。2.ID选择器id选择器用于指定带有ID的元素的样式。ID选择器前面有一个#符号-也称为棋盘或井号。#my_id{颜色：红色；font-size:50px;}需要注意的是，在HTML文档中，ID选择器会被使用一次，而且只会使用一次。并且ID选择器不能组合使用，因为ID属性不允许空格分隔的单词列表。3.类选择器CSS类选择器将根据元素的类属性中的内容匹配元素。类属性定义为以空格分隔的项目列表。在这组类名中，有一项必须与类选择器中的类名完全匹配，此样式声明才能生效。类选择器也是我们最常用的选择器之一。.my_class{颜色：红色；font-size:50px;}二、通配符选择器在CSS中，星号（*）是通配符选择器，之所以这样命名是因为它普遍适用于所有元素，它可以匹配任何类型的HTML元素。那么通配符选择器的实际应用是什么呢？常用于全局样式重置，如CSS盒模型重置：*,*::before,*::after{box-sizing:border-box;}表示我们希望所有元素在box中包含padding和border模型计算，而不是将这些宽度添加到任何定义的尺寸。例如，在以下规则中，.box宽度将为200px而不是200px+20px：.box{width:200px;padding:10px;}3.属性选择器CSS属性选择器通过已有的属性名或属性值匹配元素。这是一个非常强大的选择器，但通常没有充分发挥其潜力。CSS属性选择器可以获得类似于正则表达式的匹配结果。这对于修改BEM风格的系统或其他使用相关类名但可能不是单个通用类名的框架很有用。让我们看一个例子：[class*="component_"]这个选择器将选择所有类包含component_字符串的元素。可以通过在关闭属性选择器之前包含i来保证不区分大小写的匹配：[class*="component_"i]当然我们也可以不指定属性值，只是简单的检查是否存在，比如下面的选择器就会选择具有任何类值的所有a标签：a[class]属性选择器可用于执行一些基本的可访问性检查，例如：img:not([alt]){outline:2pxsolidred;}这将添加一个轮廓所有不包含alt属性的图像。四、子选择器当使用>选择器分隔两个元素时，它只会匹配那些作为第一个元素的直接后代（子元素）的第二个元素。子组合选择器是唯一在元素级别工作的选择器，可以组合以选择嵌套元素。?选择文章>p