背景设置

字体

p{font-family :"";}设置字体类型
p{font-size:12px;} 字体大小em rem
p{font-style}字体风格 normal正常字体 italic斜体 oblique倾斜
font-weight 设置字体粗细 normal 默认 bold粗体 colder更粗 lighter 更细
p{font: ; 字体属性顺序：字体风格>字体粗细>字体大小>字体类型

文本属性

color rgb rgba设置文本颜色
p{text-align:"";} 文本对齐方式：left靠左 right靠右 center居中 justify两端对齐
p span{text-indent: ;} 文本段落：首行缩进 em/px
line-height:设置行高px 一般行高是字体的两倍左右 和容器设置高度一样则文本垂直居中

文本修饰和垂直对齐

text-decoration{none;：默认值定义的标准文本;
underline:设置文本的下划线;
overline:设置文本的上划线;
line-through:设置文本的删除线;
}

垂直对齐方式

img p{vertical-align属性：middle垂直居中、top靠上、bottom靠下
}

文本阴影

text-shadow : color（颜色） x-offset（水平偏移向右是正数向左是负数） y-offset （垂直偏移向下是正数向上是负数） blur-radius（模糊半径）；

超链接状态

a:link 点击之前
a：visited 单机访问后的样式
a：hover 鼠标悬浮的时候
a:active 鼠标单击未释放时的状态
顺序 link>visited>hover>active
a{text-decoration
color}

列表样式

​

​
list-style-type;;;设置项目符号样式
none不要项目符号
disc实心圆 默认
circle空心圆
square正方形
decimal数字

背景样式

background-color 背景颜色
background-image背景图片 background-image：url（图片路径）

背景图片重复方式

background-repeat

1. repeat
2. no-repeat 不平铺
3. repeat-x 水平平铺
4. repeat-y 垂直平铺

背景定位

{background-position ：20px 20px

​ 50% 50%

​ （ 靠左 left 居中center 靠右right） （靠上top 居中center 靠下bottom）

}

设置背景background顺序

background:#C00（yanse）url(../image/arrow-down.gif) （路径）205px 10px（偏移） no-repeat（平铺）;

背景尺寸 {background-size:

auto 默认值

percentage 按元素百分比放大

cover 放大 充满整个元素

contain 发大 按原先的宽和高比例放大

css3渐变 background：linear-gradient（position[方向]，color1，color2）

从左到右 to right

从右到左to left

从上到下to bottom

加不同的前缀浏览器的兼容background：-ms-linear-gradient（position，color1，color2）

IE浏览器是Trident内核，加前缀：-ms-
Chrome浏览器是Webkit内核，加前缀：-webkit-
Safari浏览器是Webkit内核，加前缀：-webkit-
Opera浏览器是Blink内核，加前缀：-o-
Firefox浏览器是Mozilla内核，加前缀：-moz-