css的引入方式
内联样式
内部样式
外部样式（推荐）
选择器
全局选择器：
可以与任何元素匹配，优先级最低，一般做样式初始化
元素选择器：
html文档中的元素（p，b，div，a等）
类选择器：
规定用原点来定义
class属性的特点
1.类选择器可以被多种标签使用
2.类名不能以数字开头
3.同一个标签可以使用多个类选择器。用空格隔开
ID选择器：
针对某一个特定的标签来使用，只能使用一次
选择器的优先级（CSS中）：
（1）元素选择器的权重为：1
（2） class选择器的权重为：10
（3） id选择器的权重为：100
（4）内联样式的权重为：1000
其优先级从高到低：行内样式>ID选择器>类选择器>元素选择器
字体属性
color：规定文本的颜色
font-size：设置文本的大小
font-weight：设置文本的粗细
font-style 指定文本的字体样式（normal 默认值；italic 定义斜体字）
每个值用逗号分开 如果字体名称包含空格，它必须加上引号
背景属性
left：文本居左排列，默认值 right：把文本排列到右边 center：把文本排列到中间
文本属性
text-align 指定元素文本的水平对齐方式
text-decoration属性规定添加到文本的修饰
下划线：underline
上划线：overline
删除线：live-through
text-transform属性控制文本的大小写
captialize：每个单词开头大写
uppercase：全部大写字母
lowercase：全部小写字母
表格属性
边框线样式（solid实线）
大小（px）
边框线颜色 （color）
CSS选择器
id选择器
注意d表示唯一性，所以同一个页面中id不能重名（以#开头）
class类选择器
以.开头表示类选择器，可以重复
tag标签选择器
直接使用标签名定义
伪类选择器
：link（未访问链接）
：hover（划过）
:disabled匹配失效的标签
伪类和伪元素的区别
- 伪类使用单冒号表示
- 伪元素使用双冒号表示，为了兼容性也可以使用单冒号
- 伪元素会创造一些不存在原有文档结构的元素，它不可复制，也没有具体的标签名
- 伪类表示已存在的某个元素处于某种状态，这种状态dom树无法表示（比如nover),就可以通过伪类来你补这块不足
伪类为什么要非在伪元素的前面？
因为伪元素不在dom文档中
before是指在元素的前面创建
after是指在元素的后面创建
content表示需要插入的内容
webkit-scrollbar滚动条美化
::-webkit-scrollbar 滚动条整体部分
:：-webkit-scrollbar-thumb 滚动条移动小方块
::-webkit-scrollbar-track 滚动条轨道（小方块在上面移动）
::-webkit-scrollbar-button 滚动条轨道两端的按钮
::-webkit-scrollbar-track-piece 内层轨道，滚动条中间部分（除去）
::-webkit-scrollbar-corner 边角，及两个滚动条的交汇处
::-webkit-resizer 两个滚动条的交汇处上用于通过拖动调整元素大 小的小控件
盒子属性
width：宽度
max-width：最大宽度
min-width：最小宽度
height：高度
max-height：最大高度
min-heigh：最小高度
padding填充
vw是根据可视宽度来换算的
vh是根据可视高度来换算的
margin为边距（页面边距）
border-radius圆角
- 全部：
border-radius - 上右下左：
border-radius - 上左：
border-top-left-radius - 上右：
border-top-right-radius - 下左：
border-bottom-left-radius
box-shoadow盒子阴影
box-shoadow:inset水平偏移 垂直偏移 模糊度 阴影尺寸 阴影颜色
overflow：溢出
visible：可见auto：自动hidde：隐藏sroll：滚动overflow-x：单独设置横向滚动条overflow-y:单独设置纵向滚动条
渐变效果
shape属性： ellipse椭圆形(默认) circle圆形
position属性：center(默认) top bottom
float浮动属性
一旦给一个元素设置float,那么它会自动转换为display:block
clear 清除浮动
- 直接给
height高度，但本质不是清除 - 增加额外标签方案
- 触发BFC方案：
overflow
品字形布局
左右栏布局
双飞翼布局
定位
static静态定位（默认）：跟随页面滚动relative相对定位 ：相对定位坐标是相对于自身的定位（自身左上角为原点) ；跟随页面滚动absolute绝对定位 ：相对于body定位，跟随页面滚动（徽标、下拉菜单）fixed固定定位 ：固定定位始终是以body为坐标原点进行定位，不会跟随页面滚动sticky粘性定位：默认跟随页面滚动，当滚动到目标位置开始固定不滚动粘性定位坐标，参考位置和相对定位是一样的 -top、right、bottom和left`方向z-index层级