1.span标签
span标签是HTML5的行内标签,被用来组合文档中的行内元素。
2.字体样式
font-family:设置字体的类型,常用的字体有宋体、微软雅黑、黑体等,可以设置多个字体中文要记得加英文“”号
font-size:设置字体的大小,常用单位是px还有其他的in,cm,mm等,但并不实用。
font-style:设置字体风格
font-weight:设置字体的粗细
font:用于对字体的综合设置
font-style属性用于设置字体风格如斜体,normal默认值显示标准的字体,italic:显示斜体的字体样式,oblique:显示倾斜体的字体
font-weight属性用于设置字体的粗细,bold定义粗体字符,bolder定义更粗的字符,lighter定义更细的字符,100~900可以自定义粗细
font可以对字体进行综合设置,语法:p{font:font-style font-weight font-size;}各属性之间以空格隔开
3.文本样式
- color:设置文本的颜色
1.使用颜色名称来直接定义颜色,如:color:yellow
2.使用十六进制代码指定颜色,如:color:#00F;记住一定要颜色代码前加#号
3.RGB使用红绿蓝这光学三原色,只要设置好这三种颜色,就可以形成各种颜色
4.RGBA:是RGB方法的拓展,只是加了一个alpha属性,要用到有透明度的颜色时,可以用这个属性控制透明度,值为0~1,越小越透明
- text-align:设置文本内容水平对齐
left:默认值,左对齐
right:右对齐
center:居中对齐
justify:两端对齐
- text-indent:设置首行文本的缩进
每个段落的首行都会空出字符,属性值可以是em和px,2em表示缩进两个字符
- line-height:设置文本的行高
行高就是行与行之间的距离,属性单位分别有px,em,和百分比,通常按字体大小的倍数表示,16px行高就可以设置为32px
- text-decoration:设置文本的装饰
none:默认值没有装饰
underline:下划线
overline:上划线
line-through:删除线
- vertical-align:设置文本内容的垂直对齐
文本垂直居中,属性值有middle,top,bottom
- text-shadow:设置文本阴影效果
{text-shadow:10px 8px 5px #999;}分别是设置水平阴影位置,垂直阴影位置,模糊距离,还有阴影的颜色
4.超链接伪类
a:link{ }设置未访问前超链接的状态
a:visited{ }单击访问后的状态
a:hover{ }鼠标指针悬停时的状态
a:active{ }鼠标未释放时的状态
list-style去除列表样式的圆点符号或数字
5.背景样式
background-color:规定背景颜色
background-image:规定要使用的背景图
background-repeat:规定重复的背景图像
repeat:默认,背景会在垂直方向和水平方向重复
repeat-x:水平方向重复
repeat-y:垂直方向重复
no-repeat:背景图像仅显示一次。
background-position:规定背景图像的位置
top顶部 left,right左和右,bottom底部,如果只定义一个值,那第二个值默认为center
background:复合属性,综合设置
background-size:规定背景的尺寸,length设置宽高,percentage以父元素的百分比设置宽高,cover背景图拓展覆盖
contain把图像扩展至最大尺寸,完全适应内容区域
线性渐变
background-image:linear-gradient(方向,颜色1,颜色2);颜色至少定义两种