CSS 基础总结一
开发环境
选择器
作用：查找标签，设置样式。基础选择器包括：
标签选择器
使用标签名作为选择器，选中同名标签设置相同样式。
类选择器
作用：查找标签，差异化设置标签的显示效果。可以给多个标签使用。同一个标签使用多个类选择器时，类名用空格隔开。
.red {
color: red;
}
.size {
font-size: 50px;
}<p class="red size">这个标签使用了两个类选择器，效果是他们的叠加</p>id 选择器
作用：查找标签，差异化设置标签的显示效果。id 选择器一般配合 js 使用，很少用来设置 css 样式。同一个 id 选择器在一个页面中只能使用一次。
通配符选择器
作用：查找页面所有标签，设置相同样式。通配符选择 * 不需要调用，浏览器会查找页面中所有标签，设置相同的样式。
文字控制属性
/* 如果挨着的两位相同可以简写为#0f0 */
color: #00ff00;font-style: normal/italic;ont-weight: bold/normal;/* 30像素或者2倍高度 */
line-height: 30px / 2;/* em是一个字的大小 */
text-indent: 2em;/* 去掉下划线/下划线/删除线/上划线 */
text-decoration: none/underline/line-through/overline;text-align: left/center/right;font-family: "PingFang SC", "Source Han Sans CN", "Microsoft YaHei", "Heiti SC",
tahoma, arial, "Hiragino Sans GB", 宋体, sans-serif;font: 12px / 1.5 PingFang SC, Source Han Sans CN, Microsoft YaHei, Heiti SC,
tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;复合选择器
由两个或者多个基础选择器，通过不同的方式组合而成。选择目标元素时更加准确高效。
后代选择器
选中某元素的后代元素。写法：父选择器 子选择器 {CSS 属性}，父子选择器之间用空格隔开。
子代选择器
选中某元素的子代元素（最近的子代）写法：父选择器 > 子选择器 {CSS 属性}，父子选择器之间用 > 隔开。
并集选择器
选中多组标签设置相同的样式。写法：选择器 1，选择器 2，选择器 3，...{CSS 属性}，选择器之间用 , 隔开。
交集选择器
选中同时满足多个条件的元素。写法：选择器 1 选择器 2{CSS 属性}，选择器之间没有任何符号。标签选择器必须写在最前面。
伪类选择器
伪类表示元素状态，选中元素的某个状态设置样式。
提示
如果要给超链接设置以上四个状态，需要按照 LVHA 顺序书写。
CSS 特性
提示
优先级公式：通配符选择器<标签选择器<类选择器<id 选择器 <行内选择器 < !important。选中的范围越大优先级越低。
!important 添加在属性值后面。提高优先级到最高。
如果是复合选择器，则需要权重叠加计算。
规则是：
行内选择器个数，id 选择器个数，类选择器个数，标签选择器个数。从左到右依次比较个数，同一级个数多的优先级高。如果个数不同，则向后比较。
!important 权重最高。
继承权重最低。
Emmet 写法
代码的简写方式，输入缩写 VS CODE 会自动生成对应的代码。
背景属性
background-image: url(url);background-repeat: no-repeat/repeat/repeat-x/repeat-y;left/right/center/top/bottom/正负数字+px。正数向右下移动，负数向上左移动。
第一种：可以颠倒水平垂直方向的关键字；
第二种：可以只写一个关键字，另一个方向默认为居中；
第三种：数字只写一个值表示水平方向，垂直方向居中。
background-position:0 0;
background-position:bottom center;
background-position:center bottom;
background-position:50px center;
background-position:center -100px;第一种：cover：等比例缩放背景图片以完全覆盖背景区，背景图可能出现部分看不见；
contain：等比例缩放背景图以完全装入背景区，可能背景区部分空白。
第二种：百分比：根据盒子尺寸计算图片大小。100%图片的宽度和盒子的宽度一致，高度等比缩放。
第三种：数字+单位px。
background-size:cover/contain;
background-size:100%;background-attachment：fixed。书写格式：背景色 背景图 背景图平铺方式 背景图位置/背景图缩放 背景图固定(空格隔开，不区分顺序)
background：pink url(../Res/img.png) no-repeat center bottom/cover显示模式
标签的显示方式。