（1）text-shadow 属性，它是文本内容的化妆师：
让字体看起来更立体，更具艺术性，让人眼前一亮，可以给文字使用文本阴影属性。
在 CSS3 中，我们使用 text-shadow 属性来给文本内容添加阴影的效果。
文本阴影的语法格式如下：
text-shadow: x-offset y-offset blur color;- x-offset 是沿 x 轴方向的偏移距离，允许负值，必须参数。
- y-offset 是沿 y 轴方向的偏移距离，允许负值，必须参数。
- blur 是阴影的模糊程度，可选参数。
- color 是阴影的颜色，可选参数。
例子，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
font-size: 50px;
color:rgb(130, 236, 237);
text-shadow: 4px 4px 3px rgb(237, 130, 130)
}
</style>
</head>
<body>
<div>王耶浪Web开发学习笔记</div>
</body>
</html>- 页面上有个包含「王耶浪Web开发学习笔记」文字内容的 div 标签，我们使用 font-size 属性设置字体大小为 50px。
- 使用 color 属性设置字体颜色。
- 使用 text-shadow 属性添加文本阴影效果。
（2）CSS3 之前让浏览页面的用户看到自己设置的特殊字体样式，用户需要手动去下载该字体。很显然这是相当麻烦的，CSS3 提供了 @font-face 规则解决此问题。
使用 @font-face 规则可为用户自动下载文档中所用字体。@font-face 的作用就是从网上下载并使用自定义字体，使页面显示字体不依赖用户的操作系统字体环境。
@font-face 的语法格式如下所示：
@font-face {
font-family: 字体名;
src: 字体文件 URL;
font-stretch: 字体拉伸方式;
font-style: 字体描述;
font-weight: 字体粗细;
unicode-range: 字体支持 UNICODE 范围;
}属性说明如下表所示：
属性 | 说明 |
font-family | 设置字体的名字，必需参数。 |
src | 字体文件的下载地址，必需参数。 |
font-stretch | 字体的拉伸方式，可选参数。 |
font-style | 对于 src 所指字体的描述。如果所需字体符合描述，则采用本 font-face 所定义的字体。，可选参数。 |
font-weight | 设置字体的粗细，可选参数。 |
unicode-range | 设置字体支持 UNICODE 范围，可选参数。 |
@font-face 通常接受以下几种字体文件类型：
- TrueType 格式，文件以 .ttf 结尾。
- OpenType 格式，文件以 .otf 结尾。
- Web Open Font 格式，文件以 .woff 结尾。
- Embedded Open Type 格式，文件以 .eot 结尾。
- SVG 格式，文件以 .svg 结尾。
例子，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
@font-face {
font-family: "Source Han Serif SC";
src: url("https://labfile.oss.aliyuncs.com/courses/3773/SourceHanSerifSC-Heavy.otf");
}
body {
font-family: "Source Han Serif SC";
font-size: 30px;
color: cornflowerblue;
}
</style>
</head>
<body>
王耶浪Web开发学习笔记
</body>
</html>
本文暂时没有评论，来添加一个吧(●'◡'●)