这是我参与「第四届青训营 」笔记创作活动的第3天
CSS
Cascading style sheet层叠样式表：修饰网页信息的显示样式
空格换行等不影响书写格式
e-g：脸{眼睛：放大1公分；嘴：缩小1公分}
在html中用style套css
@import可能存在老浏览器兼容性问题，link不存在兼容性问题
@import后加载，link同时加载
行内标签
优先级：外〈内〈行内〈！important 就近原则
在外部标签div{color:red!important}表明important，会变成最高优先级
优先级针对同一标签/属性\
选择器：使用css对html页面中的元素进行一对一、一对多、多对一的控制
.ibm{background-color: blue;}
</style>
</head>
<body>
<div>11111111111</div>
<div class="ibm">22222222222</div>
可以有复数的类别
复数类别执行优先级：就近原则（代码从上倒下，看style标签执行的顺序） 样式：.号！！！ id选择器：唯一确定 样式：#号！！！ 同一个ID只能给一个标签，一个标签也只有一个id Margin外边距；padding内边距 /群组选择器：提出公共代码，节约代码量/
<!-- <style>
div,p,h1{background-color:yellow;}
</style> -->
<!-- <style>
div,.ibm,#box1{background:red;}
</style> -->
群组选择，既可以选择标签，也可以选择id，class等 后代选择器
div p{background-color:yellow;}
</style>
</head>
<body>
<div>
<p>
11111111111
</p>
</div>
<p>
222222222
</p>
用空格表示（包含/后代）
后代选择器从右到左选择
color:yellow;}
/* 初始状态 */
a:visited{color:red;}
/* 访问之后 */
a:hover{color:orange;}
/* 鼠标移到该位置但没有点击 */
a:active{color:blue;}
/* 点击后变成绿色 */
顺序要注意 Link-visited-hover-active
选择器权重：当多个选择器选中同一个元素，都定义了样式，如果属性发生冲突，则选择权重高的来执行
内联样式：行内
2、伪元素
概念：创建一些不在文档树中的元素，并为其添加样式。(就是选取某些元素前面或后面这种普通选择器无法完成的工作,虽然用户可以看到这些文本，但是这些文本实际上不在文档树中。)它可以用于
• 设置元素的首字母、首行的样式
• 在元素的内容之前或之后插入内容
