#### css属性
* 列表属性
+ 列表符号 list-style-type
- disc 实心圆
- circle 空心圆
- square 实心方块
- **none 去掉列表符号** list-style:none
+ 列表符号的位置 list-style-position
- outside 默认值,在li的外面
- inside 在li的里面
+ 列表符号图片 list-style-image
- url(图片的路径)
+ **说明:列表属性自带的样式不使用,只使用去掉列表的属性,然后将列表前面的图标通过背景图的方式引入**
* 边框属性
+ 边框宽度 border-数值+px
+ 边框样式 border-style
- solid 实线
- dashed 虚线
- dotted 点线
- double 双实线
+ 边框颜色 border-color:颜色值
- 不设置即为字体颜色
+ **复合写法 border:边框宽度 边框样式 边框颜色;** 顺序不固定
+ 单方向边框 border-方向(left/right/top/bottom)
- border-bottom: 10px solid red;
- **修改单方向的边框样式一定要写在复合写法的后面**
- 去掉边框的属性 **border-单方向:none**
* 背景属性
+ 背景颜色 "> + 背景图 background-image: url(背景图的路径)
+ 背景图的重复方式 background-repeat
- repeat 重复 默认值
- repeat-x 只在x轴或者横轴重复
- repeat-y 只在y轴或者纵轴重复
- no-repeat 去掉重复
+ 背景图的位置 background-position: 横轴 纵轴;
- 默认在区域的左上角显示,向右的和向下是正数
- 数值+px 数值+px;
- 百分比 百分比; 横轴的百分比相对于区域的宽度, 纵轴的百分比相对于区域的高度
- 关键字
- 横轴 left/center/right
- 纵轴 top/center/bottom
- 只设置一个值表示横轴的位置 纵轴默认居中
+ 复合写法 **background: 颜色 图片路径 重复方式 背景图位置** (顺序不固定)
- 展开的写法要放到复合写法的后面
- 背景色和背景图的路径可以单独用background的属性
- 多个属性一定要用复合的写法
+ 背景图的大小 background-size: 宽度 高度
+ 数值+px 数值+px
+ 百分比 百分比 宽度是区域宽度的百分比 高度是区域高度的百分比
+ 关键字
- cover 拉伸背景图 会导致图片被裁切
- contain 拉伸背景图 区域可能会出现留白
+ 背景图的固定 background-attachment
- scroll 滚动 默认
- fixed 固定 背景图不会跟随滚动条而滚动,背景图位置所参考的区域是浏览器的窗口
+ 特点
- 不占位置
* 背景图和img标签的选择
- 背景图不占位置,img引入的图片占位置
- 背景图一般是作为网页的修饰,图片是网页的内容
* 三角形
* 鼠标样式
#### 浮动
* 浮动 float
- none 默认值 不浮动
- left 左浮动
- right 右浮动
* 浮动的特点
- 从父元素的边缘开始挨着排列
- 父元素宽度不够的时候,浮动元素会掉下来,掉到浮动所设置的位置,比如左浮动,元素会掉到做百年
- 元素设置浮动后会脱离文档流,没有设置浮动的元素会占据浮动元素的位置,文字不会被遮挡
- 浮动元素不会超过没有设置浮动的元素
* **浮动的应用场景**
- 将纵向排列的元素横向排列,给每一个需要横向的排列的元素都添加浮动
#### 矩形工具切图
+ 选中所要存的图
+ ctrl+c
+ ctrl+n 回车
+ ctrl+v
+ 左上角文件=>生成=>快速导出png