CSS3美化网页元素
span标签能让几个文字或某个词语凸显出来
能让某几个文字或者某个词语凸显出来
<span id="dream"互联网+梦想</span</p
字体样式
font-family
设置字体类型
font-family:“隶书”;
font-family属性
p{font-family:Verdana,“楷体”;}
body{font-family: Times,“Times New Roman”, “楷体”;}
font-size
设置字体大小
font-size:12px;
字体大小:font-size属性
px(像素)
em、rem、cm、mm、pt、pc
h1{font-size:24px;}
h3{font-size:2em;}
font-style
设置字体风格
font-style:italic;
normal、italic和oblique
font-weight
设置字体的粗细
font-weight:bold;
font-weight属性norme默认值定义标准字体bold 粗体字体bolder更粗的字体lighting更细的字体100.200.300.由细到粗的字体400=norme700=bold
font
在一个声明中设置所有字体属性
font:italic bold 36px “宋体”;
字体属性的顺序:字体风格→字体粗细→字体大小→字体类型p span{font:oblique bold 12px “楷体”;}
文字样式
color
设置文本颜色
color:#00C;rgb(r,g,b) : 正整数的取值为0~255rgba在RGB基础上增加了控制alpha透明度的参数,其中这个透明通道值为0~1
color:rgba(0,0,255,0.5);
text-align
设置元素水平对齐方式
text-align:right;left把文本排列到左边。默认值:由浏览器决定right
把文本排列到右边center
把文本排列到中间justify
实现两端对齐文本效果
text-indent
设置首行文本的缩进
text-indent:20px;图片垂直居中
为图片设置:
vertical-align: middle;
display: inline-block;line-height
设置文本的行高
line-height:25px;行高
line-height:px
文本垂直居中:把行高和高的大小设为一致
height: 200px;
line-height: 200px;text-decoration
设置文本的装饰
text-decoration:underline;文本装饰
text-decoration属性
垂直对齐方式
vertical-align属性:middle、top、bottomnone
默认值,定义的标准文本underline
设置文本的下划线overline
设置文本的上划线line-through
设置文本的删除线文本的阴影text-shadow : color x-offset y-offset blur-radius;