字体族

最新推荐文章于 2022-12-20 16:17:57 发布

极客研究者

最新推荐文章于 2022-12-20 16:17:57 发布

阅读量480

点赞数

分类专栏： CSS样式表文章标签： css css3

本文链接：https://blog.csdn.net/qq_34550459/article/details/105574084

版权

CSS样式表专栏收录该内容

39 篇文章 0 订阅

订阅专栏

设置字体常用属性:
color:字体的颜色
font-size:字体的大小

font-family:字体族(字体的格式)

serif:衬线字体
sans-serif:非衬线字体
monospace等宽字体
-指定字体的类别,浏览器会自动使用该类别下的字体

font-family:可以同时指定多个字体,多个字体之间用逗号隔开
字体生效时优先使用第一个,第一个无法使用则使用第二个,以此类推.

京东使用的字体:
Microsoft YaHei,Heiti SC,tahoma,arial,Hiragino Sans GB,"\5B8B\4F53",sans-serif
哪个字体生效,取决于电脑中是否存在这个字体
查看：C:\Windows\Fonts 当前计算机支持哪些字体

Demo:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>字体族</title>
    <style>
        /* font-face可以直接将服务器上的字体提供给用户使用
           font-family:设置自定义字体的名称
           src:设置自定义字体的相对路径和绝对路径
           可以是当前项目的路径,也可以网络路径
            问题：
            1.加载慢问题(需要从网络中获取)
            2.版权问题
        */
        @font-face {
            font-family:'myCustomFonts';
            src: url('../../fonts/ZCOOLQingKeHuangYou-Regular.ttf');
        }

    p{
        color: red;
        font-size:30px;
        font-family:myCustomFonts;
    }
    </style>
</head>
<body>
    <p>今天阳光明媚,今天多云转晴!</p>
</body>
</html>

极客研究者

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
字体族

设置字体常用属性:color:字体的颜色font-size:字体的大小font-family:字体族(字体的格式)serif:衬线字体sans-serif:非衬线字体monospace等宽字体-指定字体的类别,浏览器会自动使用该类别下的字体font-family:可以同时指定多个字体,多个字体之间用逗号隔开字体生效时优先使用第一个,第一个无法使用则使用第二个,以此类推.京东使用...
复制链接

扫一扫