目录
CSS语法
开发工具
块元素和内联元素
选择器
元素选择器
id选择器
类选择器
选择器分组(并集选择器）
交集选择器（复合选择器）
通配选择器
元素间关系
后代元素选择器
子元素选择器
CSS语法
css 注释：作用和HTML注释类似，只不过他必须编写在style标签中，或者是css文件中
css语法：
选择器 声明块
选择器：通过选择器可以选中页面中指定的元素，并且将声明块中的样式应用到选择器对应的元素上。（元素就是标签，标签就是元素）
声明块：声明块紧跟在选择器后面，使用一对大括号括起来。声明块中实际上就是一组一组的名值对结构，这一组组的名值对就称之为声明。一个声明块中可以写多个声明，多个声明之间使用分号；隔开。
声明的样式名和样式值之间使用冒号：来连接
开发工具
开发工具：hbuilder
之所以选择它，是因为他是免费的， 而且是国人开发的， 支持全中文模式。
块元素和内联元素
<div>
块元素：
其实diva就是一个块元素，所谓的块元素就是会独占一行的元素。
div这个标签没有任何意义，就是一个纯粹的块元素，并且不会和他里面的元素设置任何的默认样式。
div元素主要是用来对页面进行布局的
常用的块元素有p/h1/h2/h3等等
内联元素：
span是一个内联元素（行内元素），所谓行内元素，指的是只占自身大小的元素，不会占用一整行，当一行容不下了，会自动换行
常用的内联元素：a/img/iframe/span
span没有任何意义，span是专门用来选中文字，然后为文字设置样式的
块元素主要用来页面的一个布局，内联元素，主要为选中的文本设置样式，一般情况下只是用块元素包含内联元素，不会使用内联元素包含块元素
a元素可以包含任意元素，除了它本身自己不可以
p元素不可以包含任何其他的块元素
选择器
元素选择器
通过元素选择器可以选中所有的指定元素
语法：标签名：{ }
例：p{ color:red; }
h1{ color:red; }
id 选 择 器
通过元素的id属性选中唯一的一个元素
语法：#id属性值{}
例：#idp{font-size:20px；}
类 选 择 器
通过元素的class属性值选中一个元素
class属性和id属性类似，只不过class属性可以重复，拥有相同的class属性值的元素，我们说他们是一组元素，可以同时为一个元素设置多个class属性值，多个值之间使用空格隔开
语法：.class{}
选择器分组(并集选择器）
通过选择气氛组可以同时选中多个选择器对应的元素
语法：选择器1，选择器2，选择器N{ }
例：#p1,.p2,h1{ background-color:red;}
交集选择器（复合选择器）
可以选中同时满足多个选择器的元素,对于id选择器不建议使用此交集选择器
语法：选择器1选择器2选择器N{ }
例：span.p3{background-color:red;}
通配选择器
选中页面中所有的元素
语法：*{ }
例：*{color:yellow;}
元素间关系
父元素：指的是直接包含子元素的元素
子元素：指的是直接被父元素包含的元素
祖先元素：指的是直接或者间接包含后代元素的元素。所以父元素也是祖先元素
后代元素：指的是直接或间接呗祖先元素包含的元素。所以子元素也是后代元素
兄弟元素：指的是拥有同一个父元素的元素被叫做兄弟元素
后代元素选择器
选中指定元素的后代元素
语法：祖先元素 后代元素{}
注意：和交集选择器不同的是 祖先元素和和后代元素中间的空格
子元素选择器
选中指定父元素的指定子元素
语法：父元素>子元素{}
注意：不同浏览器的支持不同
欢迎点击下方卡片，关注《coder练习生》
