后代选择器

：空格，；根据html标签的嵌套关系，选择父元素后代中满足条件的元素；；选择器1 选择器2{css}大概：body空格img{添加所需属性}。首先搭建父子级的标签关系，才能使用后代选择器！

子代选择器

： > 只选择儿子，再下级的元素忽略。

上两类选择器最大区别，后代是父元素以下的所有元素都能选择。子代父元素只能找亲儿子，一代就结束。

并级选择器

： 点.号隔开；推荐写一个选择器之后逗号就换行，显得干净利落整洁

交集选择器

： 紧挨着 ；选择器1选择器2（中间绝不能加空格）如果遇到了标签名，则标签需要写到最前面/最左边

hover；鼠标移入时显示元素

任何标签都可以使用为类选择器“引号 ：hover”，目的；当鼠标移入元素时执行

背景平铺：background-repeat

（bgr）属性值；repeat默认值，水平和垂直方向都平铺/no-repeat不平铺/repeat-x横着铺/repeat-y竖着普

例如：a：hover img ；a里面的图显示/也可以理解为选中的父级通过hover包含子级达成想要的效果；鼠标移入时所需要展出的效果，中间夹着hover后选中 子级。a里面的图，所以a父级，图子级/a：hover img 。

背景位置：background-position

(bgp）水平方向位置，垂直方向位置； 中间空格隔开，例如 left top；；水平方向的 有left/center/right；；垂直方向有top/center/bottom

文本垂直居中设置

文本垂直居中：line-height=设置好的行高属性值

背景相关属性的连写形式：

background(bg);;不分先后顺序只限于背景色，背景图，背景平铺；背景位置如果是英文单词也是可以不分先后顺序；；如果是数值单位，就不能颠倒顺序

对比图片跟背景图的重要性

对比img跟背景图的意义 img用来实现比较重要的图片 background-images，不太重要的图；装饰性美化性的使用背景图

背景图片必须给盒子设置宽高；图片标签不需要设置宽高也可以显示，并且能撑开div

块级元素；

特点，独占一行（一行只能显示一个）/宽度默认是父元素的宽度，高度默认由内容撑开/可以设置宽高；代表标签 div,p,h系列。

行内元素：

不执行，设置宽高不生效，尺寸和内容的大小相同；；特点：一行可以显示多个，宽度和高度默认由内容撑开，内容有多大，行内宽苞就有多大，不可以设置宽高；；代表标签有/a /span

行内块元素

：一行可以显示多个，可以设置宽高；代表标签input/textarea/button/select;;特殊情况：img标签有行内块元素特点，但是在谷歌调试工具

元素显示模式转换：display:block

转换成块级元素；较多/display:inline-block转换成行内块元素；较多/display：inline转换成行内元素；极少

注意事项

p标签不能包含div,p,h等块级元素 a标签内部可以包含任何元素，但是a标签不能包含a标签自己 p比较特殊一般不包含其他东西，因为只是一个段落标签，更适合文章

行内元素居中，需要给父元素加 行内元素居中，需要给父元素加 行内元素居中，需要给父元素加

细节注意

块级元素想水平居中，则只能使用margin: 0 auto；

垂直居中：line-height=设置的高度

继承属性：控制字的都能继承，不是字的就不能；注意：自己有自己的默认规则，就不会继承