字体样式（font-family）

发呆少女

于 2022-04-04 17:34:20 发布

阅读量1.1k

点赞数

分类专栏： CSS学习文章标签： css

本文链接：https://blog.csdn.net/qq_43632490/article/details/123957087

版权

CSS学习专栏收录该内容

33 篇文章

订阅专栏

本文深入探讨了CSS中的font-family属性，介绍了如何设置网页文本的字体样式，包括如何定义字体组合，确保跨浏览器和跨平台的兼容性。通过学习，你可以掌握创建具有良好视觉效果的网页文本的技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="zh-CN">
<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>字体</title>
    <style>
        h3 {
            /* tips 1: 字体属性值可以写中文或者英文（更推荐写英文，兼容性更好）。*/

            font-family: 'Microsoft YaHei';
            /* font-family: '微软雅黑'; */
        }

        p {
            /* tips 2: 可以写多个字体，并用逗号隔开。
               (页面显示时，会先寻找第一种字体，如果有该字体就显示，否则再寻找下一个，如果都没找到就显示浏览器的默认字体)
              （谷歌浏览器的默认字体为：微软雅黑 Microsoft YaHei）

               tips 3：字体单词为多个时，用空格隔开单词，并加引号。*/

            font-family: 'Times New Roman', Times, serif;
        }

    </style>
</head>
<body>
    <h3>一剪梅·红藕香残玉簟dian秋</h3>
    <p>hello hello hi </p>
    <div>云中谁寄锦书来？雁字回时，月满西楼。</div>
    <h2>花自飘零水自流。一种相思，两处闲愁。</h2>
    <span>此情无计可消除，才下眉头，却上心头。</span>
</body>
</html>

在这里插入图片描述