在CSS3中对于文字和文本的处理添加了许多新的效果，比如说对于文本添加了阴影效果text-shadow，word-wrap换行的效果，而在之前我们只能通过JS来设置。
1. text-shadow
text-shadow属性给文本设置阴影，与前面提到的box-shadow属性设置方法类似
设置方法为： text-shadow：水平偏移量x，垂直偏移量y，模糊范围（阴影大小），颜色
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文字文本</title>
<style type="text/css">
.t1{
color:#0080FF;
text-shadow: 2px 2px 2px #EA0000;
}
.t2{
text-shadow: 0px 0px 3px #EA0000;
}
.t3{
color:white;
text-shadow: 2px 2px 4px #000;
}
</style>
</head>
<body>
<h1 class="t1">Web Design</h1>
<h1 class="t2">Web Design</h1>
<h1 class="t3">Web Design</h1>
</body>
</html>
2.word-wrap
word-wrap是指的长单词长文本的一个折叠效果，允许长单词，URL地址强制进行换行操作
取值：word-wrap:normal/break-word
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文字文本</title>
<style type="text/css">
.wdrp1{
width:8em;
color:#0080FF;
border: 1px solid #333;
word-wrap: normal;
}
.wdrp2{
color:#0080FF;
width:8em;
border: 1px solid #333;
word-wrap: break-word;
}
</style>
</head>
<body>
<p class="wdrp1">serdtfyuhijoksedrtfyguhijokpdrftgyhuijokptfgyuhi</p>
<p class="wdrp2">serdtfyuhijoksedrtfyguhijokpdrftgyhuijokptfgyuhi</p>
</body>
</html>
3. @font-face
@font-face规则，规定一种在网页上可以特殊显示的字体，我们把页面上用到的特殊字体Web字体放在服务器上（站点文件夹fonts中），在需要时下载使用。
@font-face规则
如果你已经持有一种格式的字体，想要得到其他格式的字体，那么登录网站进行简单的格式转化即可：Webfont Generator
字体添加方法：
在站点文件夹里创建fonts字体文件夹，把四种字体文件加入文件夹
字体使用方法：
<style>
@font-face{
font-family: fontname;
src:url("文件1的相对路径"),
url("文件2的相对路径"),
url("文件3的相对路径"),
url("文件4的相对路径");
}
p{
font-family: fontname;
}
</style>
