在CSS中设置字体为宋体，核心是通过font-family属性指定对应的字体名称，同时还需要结合不同系统的字体命名规则做兼容处理，避免出现字体不生效的问题。
基础设置方法
宋体在Windows系统中的标准字体名称为SimSun，在部分场景下也可以直接使用中文名称宋体，最基础的设置方式如下：
/* 直接设置宋体 */
.text-simsun {
font-family: "SimSun", "宋体";
}
这里同时写了SimSun和宋体两个值，是因为不同浏览器对字体名称的解析规则不同，部分浏览器可能无法识别中文名称，优先使用英文名称SimSun可以保证兼容性。
不同场景的适配方案
全局设置宋体
如果希望整个页面的默认字体都为宋体，可以直接给body标签设置font-family属性：
/* 全局设置默认字体为宋体 */
body {
font-family: "SimSun", "宋体", serif;
}
这里最后添加了serif通用字体族，当用户的系统中既没有SimSun也没有宋体时，浏览器会自动使用系统默认的衬线字体作为回退方案，避免字体完全失效。
局部元素设置宋体
如果只需要给特定元素设置宋体，比如某个段落、某个标题，只需要给对应元素添加样式即可：
/* 给类名为article-title的元素设置宋体 */
.article-title {
font-family: "SimSun", "宋体", serif;
font-size: 20px;
font-weight: bold;
}
/* 给id为content的容器下的所有p标签设置宋体 */
#content p {
font-family: "SimSun", "宋体", serif;
line-height: 1.8;
}
注意事项
- 字体名称如果包含空格或者中文，必须用双引号包裹，否则CSS解析会出现错误。
- Mac系统默认没有预装
SimSun字体，如果需要兼容Mac用户，可以添加Mac下的宋体对应名称STSong，设置方式如下：
/* 兼容Windows和Mac系统的宋体设置 */
.compat-simsun {
font-family: "SimSun", "STSong", "宋体", serif;
}
- 不要给字体名称写错，比如把
SimSun写成Simsun，大小写错误可能导致部分系统无法识别字体。 - 如果页面同时加载了自定义字体文件，也可以把宋体对应的字体文件引入，再通过font-family引用，这种方式可以保证所有用户看到的字体效果一致，但会增加页面加载资源。
常见问题解答
设置了宋体但页面没有生效怎么办
可以按照以下步骤排查：首先检查字体名称是否正确，是否有拼写错误；其次检查是否有其他更高优先级的样式覆盖了当前字体设置，可以通过浏览器开发者工具查看元素的生效样式；最后检查用户系统是否安装了对应字体，必要时添加通用字体族作为回退。
可以同时使用宋体和其他字体吗
可以，font-family属性支持设置多个字体值，浏览器会按照从左到右的顺序依次匹配，第一个存在的字体就会被使用，比如font-family: "SimSun", "Microsoft YaHei", serif;就表示优先使用宋体，没有宋体就用微软雅黑，都没有就用系统默认衬线字体。
CSS字体设置宋体font_family修改时间：2026-06-22 06:51:41