11.26 CSS学习笔记

CSS，全称“Cascading Style Sheets”，用于设置HTML标签的样式，美化我们的网页。
(1)“内嵌样式”：写在style标签对里面
(2)“行内样式”：直接写在标签行上面。
(3)“外链样式”：单独写一个css文件，通过link标签引入。
(4)“导入式”：单独写一个css文件，通过@import导入。
注意：
导入式可以同时导入多个样式,但导入每个文件时要如同写内嵌样式时，在每个属性值的末尾加上一个分号结尾。
Css选择器常用类型
①　基础选择器
CSS的基础选择器主要有三个：
“标签选择器”、“类选择器”和“ID选择器”。
②　后代选择器
后代选择器是对某元素所嵌套的指定元素进行选择，每个选择符之间用空格进行分割，多个嵌套层次应该以多个空格进行分割
③　子选择器
子选择器区别与后代选择器的地方就是，后代选择器可以选择嵌套在标签内部任意层级的标签元素，而自选择器只能选择当前标签往内一层的元素。每个选择符之间用“>”进行分割，
④　伪类选择器
伪类选择器和其它选择器有所不同，它是通过触发一定的“事件”来实现效果，也就是说如果不进行任何操作是看不到该选择器的CSS样式设置的。
a:link {color: #FF0000} /* 未访问的链接 /
a:visited {color: #00FF00} / 已访问的链接 /
a:hover {color: #FF00FF} / 鼠标移动到链接上 /
a:active {color: #0000FF} / 选定的链接 */
提示：在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。
提示：在 CSS 定义中，a:active 必须被置于 a:hover 之后，才是有效的。
通用伪类选择器如下（如果要同时生效，顺序不能变）：
⑤　群组选择器
群组选择器的使用范畴是，多个选择器使用同一个样式或者同一组样式。这在做CSS样式初始化，CSS框架设计以及后期CSS代码优化时会经常使用
⑥　同级（兄弟）元素选择器
选定当前标签同级的其它指定标签。
同级元素有两种，即“+”和“~”，
“+”只能选择该标签下一个对应标签
“~”能选择该标签后的所有同级相应标签。
⑦　属性选择器
该选择器所针对的既不是某个标签，也不是类名，或者ID，它是将一个标签的属性作为选择器来使用，最常用的地方就是涉及到属性多而杂的表单元素。基本写法是“[” + “属性名” + “]”的格式，
Css选择器优先级判断
当样式冲突时，将根据【权重+就近原则】来判断以谁的样式为准。
基本类型选择器权重
行列样式：1000
Id选择器： 100
Class选择器：10 【属性选择器】
标签选择器：1
*任意符选择器：0 （大于默认样式与继承验样式）
就近原则
当权重值相同时，谁和要设置的html标签隔得近，谁的权重就高。
组合选择器权重
群组选择器： 单独计算
后代，子代，兄弟等选择器：权重相加