css学习笔记易漏知识点

在css文件中：

选择器1，选择器2，选择器3，... {
			属性： 属性值；
	}          //有逗号，这几个选择器可以理解成是 或 的关系，也就是选择器1，选择器2，选择器3等任意一个都可以应用这些样式，即选择器1，选择器2，选择器3等是同一组的。
  

 .选择器1.选择器2 {
	   	属性： 属性值；
  }         //无空格隔开，选择器1和选择器2之间没有空格，理解成 与 的关系，即必须**同时满足**选择器1和选择器2才能应用这些样式

 .选择器1  .选择器2 {
	   	属性： 属性值；
 }    //有空格隔开，选择器1和选择器2之间有空格，即在选择器1所在元素下再找子元素（该子元素带有选择器2），**父子关系**

属性选择器是[ ]中括号，*表示包含属性值，^表示以什么属性值开头，$表示以什么属性值结尾。

选择器是 * 号表示所有元素

+ 号是兄弟选择器，但是只选择一个兄弟，例如： .a + div { },则只选择与class=a的元素同级的div但是只选择一个最近的div，往下选

~ 号也是兄弟选择器，但是会选择下面所有的同级兄弟，例如： .a ~ div { },则选择与class=a的元素同级的所有div但是只选择**class=a的元素下面的所有

伪类选择器写法： 选择器:link { }或 选择器:visited { }或 选择器:hover { }或
选择器:active { } 或 input:focus { } ，因为冒号是2个点，很像类是一个点，所以叫伪类

伪元素选择器写法（: 或者 ::,单或双冒号都行）: 选择器:first-letter {} 或 选择器:after { content: " 添加的字符串";} 或
选择器:before {content: " 添加的字符串";}，带冒号的除了伪类以外就是伪元素选择器

选择器同段位的写在后面的会覆盖前面的

块级元素的display默认即 display: block （此时它会占据一整行,比如<div>），当他的样式被改成display: inline 时他就会变成行内元素。（display的取值有： block，inline，inline-block,none(控制元素不显示)）

块级元素的padding是上下左右都有间隙，而行内元素的padding是只有左右有间隙上下没间隙。
看 表严肃 的css视频