一.今日学习内容：
CSS的复合选择器：
是建立在基础选择器之上，对基础选择器进行组合形成的。
优点： 复合选择器可以更加准确，高效的选择目标元素。
常用的复合选择器：后代选择器：可以选择元素里面的子元素，外层标签写前面，内层标签写后面，中间用空格隔开。
语法：元素1.元素2{样式声明}； 元素1是父级，元素2是子级；元素2可以是孙子，也可以是儿子，只要是元素1的后代即可；元素1和元素2可以是任意的基础选择器。
子选择器：只能选择作为某元素的最近一级子元素，亲儿子选择器。元素1>元素2{样式声明}； 元素1和元素2之间用大于号隔开；元素2必须是元素1的亲儿子（孙子，重孙都不可以）。
并集选择器：可以选择多组标签，同时为他们来指定相同的样式，通常用于集体声明。 注意点： 每一组选择器可以是任意的选择器，基础选择器，复合选择器都可以。
伪类选择器： 分为俩种，一种是链接伪类选择器，一种是焦点伪类选择器。 链接选择器：<a></a>用的较多。 ：link选择所有的未被方位过的链接。 ：visited选择所以已经被访问过的链接。 ：hover选择所以链接当鼠标点击时悬浮的状态。 ：active选择所以链接点击时的状态。 注意：如果四个伪类选择器都要使用，按照lvha的顺序来写；如果想要给其他选择器添加伪类，这个选择器必须要有伪类的状态，不然不可以使用。实际工作中，hover用的最多。焦点伪类选择器： focus来实现焦点元素的样式设置。
语法：input： focus{样式声明}； 一般焦点伪类选择器都是和input来联合使用的，因为input标签有聚焦的状态。
CSS元素显示模式： 元素显示模式就是元素在网页中的显示状态就是它本身的显示模式。比如h1标签独占一行，span一行可以有多个，div独占一行。
HTML元素显示模式分类：总共分为三种，分别是块元素，行内元素，和行内块元素。
块元素：特点：独占一行，宽度默认是父级宽度的百分百；本身也可以是容器或者是盒子，里面可以放其他的行内或者块级元素，高度和宽度是可以设置的。常见的块元素：h1-h6标签，div标签，p标签，ul标签，ol标签，li标签，其中div标签是最典型的块元素。
行内元素：相邻的行内元素会在一行上进行显示；宽高设置的都是无效的；常见的行内元素有a标签，strong标签，em标签，span标签，ins标签等等。相邻的行内元素会有一点儿间隙。默认的宽高是他本身内容的宽高，行内元素只能容纳文字或者其他行内元素，比如span里面不要放div标签。
行内块元素：特点： 相邻的行内块元素在一行上显示，并且有空白缝隙（行内元素特点）；默认宽度是他本身内容的宽度（行内元素的特点）；高度和宽度可以进行设置（块级元素的特点）。常见的行内块元素：img，input，dt等等。
元素显示模式的转换： 转换为块级 display；block；转换为行内 display；inline；转换为行内块 display inline-block
CSS背景属性
背景颜色：默认值:transparents(透明度)； background-color 属性值：颜色单词，十六进制，rgb；背景图片：background-image 属性值：url（图片路径）。
背景平铺：属性：background-repeat 属性值： repeat 默认值，代表背景图片在横向和纵向上都平铺；no-repeat 代表背景图片不平铺；repeat-x 代表背景图片在横向上平铺；repeat-y 代表背景图片在纵向上平铺；
背景图片定位： background-position； 属性值：精确的像素值单位和方位名词
方位名词：没有先后顺序，都可以产生显示效果，自带x轴和y轴的定位属性。y轴方位名词：center在，top在，bottom；x轴方位名词：left，right，center。当只写了一个方位名词，另一个方位就会默认居中。
精确的像素单位; 如果用精确单位来定位背景图片，当我们只写了一个像素值，代表x轴进行了相应的设置，y轴是默认居中的，方位名词和精确像素单位可以混合使用，比如 center 100px。
背景图片的滚动：background-attachment 属性值：scroll 默认值，图片随着屏幕进行滚动； 属性值：fixed 图片不随着屏幕进行滚动。
背景的复合写法：background一般默认的顺序 属性值：background-color background-image background-repeat background-attachment background-position；实际开发中我们一般都会用复合写法。
背景半透明：语法：background：ragb（0，0，0，0.3）； ragb中间的a是alpha的缩写，透明度的意思，取值范围是0~1之间；我们习惯把0.3写成.3；0是可以省略的； 背景半透明是指盒子半透明，盒子中的内容不受影响； 背景半透明是css3里边的新增属性，不太关注兼容性写法，直接用就可以。
CSS的三大特征：层叠性，继承性，优先级三种。层叠性：相同的选择器设置相同的样式，此时新的样式就会覆盖掉旧的样式。层叠性的原则：样式冲突的时候，遵循就近原则，哪个近用哪个；样式不冲突不会层叠。继承性： 在CSS中，子标签会继承父标签的某些样式，比如文字颜色和字号等等，简单来说，子承父业。 优先级（权重）：概念：如果选择器相同，执行层叠性；如果选择器不相同，执行优先级（根据选择器的权重来执行）。
选择器和选择器权重： 继承或* 0，0，0，0 ； 元素选择器 0，0，0，1； 类选择器 ，伪类 0，0，1，0； ID选择器 0，1，0，0； 行内样式 1，0，0，0；！important 无穷大。权重的注意点： 由四组数字构成，但是不会有进位，简单的理解就是类选择器的权重永远大于元素选择器。 如果使用复合选择器，那么就将复合选择器中的基础选择器的权重相加比较即可。 继承的权重为0，父元素的样式权重再高对于子元素来说，继承下来的样式权重为0。
|
