本专栏是自己学前端的征程，纯手敲的代码，自己跟着黑马课程学习的，并加入一些自己的理解，对代码和笔记
进行适当修改。希望能对大家能有所帮助，同时也是请大家对我进行监督，对我写的代码进行建议，互相学习。
优简代码/定位问题，并解决问题
继承性
层叠性
优先级
子级默认继承父级的文字控制属性
标签自己有样式，则生效自己的样式，不继承
相同的属性会覆盖：后面的CSS属性覆盖前面的CSS属性
不同的属性会叠加：不同的CSS属性都生效
也叫权重，当一个标签使用了多种选择器时，基于不同种类的选择器的匹配规则。
选择器优先级高的样式生效
通配符选择器<标签选择器<类选择器<id选择器<行内样式<!important
选中标签的范围越大，优先级越低
如果是符合选择器，则需要权重叠加计算
行内样式 ，id选择器个数，类选择器个数，标签选择器个数
1、从左到右依次比较个数，同一级个数多的优先级高，如果个数相同，则向
后比较!important权重最高
2、继承权重最低
代码的简写方式，输入缩写 VScode会自动生成对应的代码
HTML
CSS：大多数简写方式为属性单词的首字母
背景图
网页中，使用背景图实现装饰性的图片效果。
background-image(bgi)
url(背景图URL)
背景图默认是平铺的效果
background-repeat（bgr）
| 属性 | 含义 |
|---|---|
| no-repeat | 不平铺 |
| repeat | 平铺（默认） |
| repeat-x | 水平方向平铺 |
| repeat-y | 垂直方向平铺 |
background-position（bgp）
水平方向位置 处置方向位置
| 关键字 | 含义 |
|---|---|
| left | 左侧 |
| right | 右侧 |
| center | 居中 |
| top | 顶部 |
| button | 底部 |
关键字取值方式写法，可以颠倒顺序
可以只写一个关键字，另一个方向默认为居中；数字只写一个值表示水平方向，垂直方 向为居中
设置背景图大小
backgro-size（bgz）
| 关键字 | 含义 |
|---|---|
| cover | 等比例缩放背景图片以完全覆盖背景区，可能背景图片部分看不见 |
| contain | 等比例缩放背景图片以完全装入背景区，可能背景区部分空白 |
| 百分比 | 根据盒子尺寸计算图片大小 |
背景不会随着元素的内容滚动
background-attachment（bga）
fixed
background(bg)
背景色，背景图，背景图平铺方式，背景图位置/背景图缩放，背景图固定（空 格隔开，不区分顺序）
布局网页的时候，根据标签的显示模式选择合适的标签摆放内容
独占一行
宽度默认是父级的1000%
添加宽高属性生效
一行共存多个
尺寸由内容撑开
加宽高不生效
一行共存多个
设置宽高属性生效
默认尺寸由内容撑开
display
| 关键字 | 含义 |
|---|---|
| 属性值 | 效果 |
| block | 块级 |
| inline-block | 行内块 |
| inline | 行内 |