文件编码格式对font-family的影响的说明：
大家有没有发现，在上一篇中页面效果中
font-family:
"微软雅黑","文泉驿正黑","黑体";没有起作用，
正常字体应该如下面的样式
而上节页面字体效果图如下
上面的font-family字体设置没有起作用，还是浏览器默认的字体，为什么呢？
其实是你的文件编码不同导致的。
为了说明这个问题，我们设置css样式文件分别为GBK与UTF-8演示一下：
HTML页面admin.html：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>管理员列表</title>
<link rel="stylesheet" href="list.css">
</head>
<body>
<!-- logo区 -->
<div class="logo">
<a href="">[退出]</a>
</div>
<!-- 导航区 -->
<div class="nav">nav</div>
<!-- 核心区 -->
<div class="main">
<!-- 1.渐变条，已经预留了空间 -->
<!-- 2.内容区 -->
<div class="content">
<!-- 按钮区 -->
<div class="btn"></div>
<!-- 数据区 -->
<div class="data">
<table>
<thead>
<tr>
<td><input type="checkbox">全选</td>
<td>管理员ID</td>
<td>姓名</td>
<td>拥有角色</td>
<td></td>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox"></td>
<td>1</td>
<td>唐僧</td>
<td>和尚、师傅、术士</td>
<td>
<input type="button" value="修改" class="modify">
<input type="button" value="删除" class="delete">
</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>2</td>
<td>孙悟空</td>
<td>猴王、弟子、德鲁伊</td>
<td>
<input type="button" value="修改" class="modify">
<input type="button" value="删除" class="delete">
</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>3</td>
<td>猪八戒</td>
<td>元帅、弟子、MT</td>
<td>
<input type="button" value="修改" class="modify">
<input type="button" value="删除" class="delete">
</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>4</td>
<td>沙僧</td>
<td>大将、弟子、小弟</td>
<td>
<input type="button" value="修改" class="modify">
<input type="button" value="删除" class="delete">
</td>
</tr>
</tbody>
</table>
</div>
<!-- 分页区 -->
<div class="page"></div>
</div>
</div>
<!-- 版权区 -->
<div class="copy">
<p>版权所有，违者必究。</p>
<p>官网:www.tmooc.cn</p>
</div>
</body>
</html>当list.css文件编码格式为GBK时：
最终admin.html页面效果：
当list.css文件编码格式为UTF-8时：
这时admin.html页面效果：
总结：文件的编码格式与文件内容编码要一致，不然有些样式效果会受到影响。