0

0

CSS 中的网络安全字体和后备字体是什么?

王林

王林

发布时间:2023-08-25 23:33:12

|

1675人浏览过

|

来源于tutorialspoint

转载

css 中的网络安全字体和后备字体是什么?

网站旨在为用户提供有关公司、产品和服务的信息。任何网站都需要清晰、美观,以便读者对其做出反应。网站的排版是使其一致并赋予其美感的关键因素。整个网站的个性都由排版所构建,这在创建品牌识别上至关重要。如果您使用独特而一致的排版,用户将开始将某种字体与您的品牌联系起来。

When you use good typography, you may keep readers' interest and persuade them to stay on your website for longer. By generating a solid graphic balance and a strong visual hierarchy, it aids in establishing the website's overall tone. Additionally, it influences how decisions are made and has a significant impact on how readers process and interpret the text's material. It makes the content attractive and thus impacts in the readability of the website.

通过谷歌引入的各种适用于开发者的网页安全字体,可以 下载免费。在本文中,我们将讨论网络安全字体和备用字体

由CSS提供的字体可供开发人员使用。

什么是网页安全字体?

Web safe fonts are font which are supported by all the browsers on any device. These fonts enable the developers to display them properly even if they are not installed in the users’ device.

立即学习前端免费学习笔记(深入)”;

在开发出网络安全字体之前,如果用户的本地系统没有安装该字体,浏览器会显示通用字体,比如Times New Roman。然而,开发人员无法检测到服务器端是否正确显示字体。这导致用户体验不佳。

Using web safe fonts resolves this issue. During web designing, if you use web safe fonts, you can be rest assured that your fonts will be displayed as it is in every device.

语法

element{
   font-family: font1;
}

Kinds of web safe fonts

有六种网页安全字体。它们如下所示 −

  • Serif - These fonts contain small protrusions that are present in the body of each letter. They are easier to read on screen and printed forms. Times New Roman is a serif font.

  • Monospace - 这些字体是字母之间有相等间距的字体。Space Mono、Courier、Inconsolata等都是等宽字体。

  • 无衬线字体 - 这些字体与衬线字体相反。它们不包含小突出部分。Arial、Helvetica、Futura、Calibri等都是无衬线字体的一些例子。

    WOBIZ电子商务2.0程序
    WOBIZ电子商务2.0程序

    WO@BIZ电子商务2.0软件是窝窝团队基于对互联网发展和业务深入研究后,采用互联网2.0的思想设计、开发的电子商务和社会化网络(SNS)结合的解决方案产品。WOBIZ是互联网2.0创业、传统网站转型、中小企业宣传产品网应用的最佳选择。 它精心设计的架构、强大的功能机制、友好的用户体验和灵活的管理系统,适合从个人到企业各方面应用的要求,为您提供一个安全、稳定、高效、 易用而快捷的电子商务2.0网络

    下载
  • 幻想 - 这些字体具有高度的风格和装饰性。Papyrus,Herculanum,Luminari是幻想字体。

  • MS - These are the fonts introduced by Microsoft. Trebuchet MS, MS Gothic, Georgia etc., are MS fonts.

  • 草书 - 这些字体类似于草书手写体。Brush Script MT、Broadley、Monarda、Raksana等都是一些草书字体。

Example




   
    Web Safe Fonts 
   
   
   
   


   

Web Safe Fonts

This is an example in Times New Roman font.
This is an example in Arial font.
This is an example in Courier font.
This is an example in Brush Script MT font.
This is an example in Trebuchet MS font.
This is an example in Fantasy font.

CSS中的回退字体是什么?

CSS offers two types of font families for web designing. These are generic font families like serif (Times New Roman, Georgia, etc.,) and the individual font families like Arial, Calibri etc.,.

通用字体族有一些外观相似的字体,因此,如果用户系统上没有可用的主要字体,就会有一个备用机制,其中包含一系列可以替代使用的相似字体族。这些字体被称为备用字体。它们在网页设计中被用作备份,因为没有任何一种网络字体是100%安全的。总是存在错误的可能性。

备用字体通过充当备份解决了这个问题。那些属于网络安全字体的字体族也可以设置为备用字体。一些备用字体的例子包括草书体、幻想体、等宽体等等

语法

element{
   font-family: font1, font2, font3, font4;
}

Font2, font3, font4 are the fallback fonts which are used as backup. If browser doesn’t support font1, then font2 will be displayed. If not font2, then font3 is used and so on.

Example




    Fallback fonts 
   
   
   
   


   

Fallback fonts

This is an example.

This is an example.

This is an example.

This is an example.

在上面的例子中,文本的字体系列是font1。如果任何浏览器不支持font1字体系列,则我们在其旁边有一个字体系列列表,可以作为备用字体使用。

Conclusion

在网页设计中使用网络安全字体是一个好的实践,因为它确保开发者它将在用户设备上显示。然而,网络安全字体并不是100%可信赖的。因此,可以使用CSS备用字体作为字体的备份,以便如果一个字体系列不起作用,浏览器可以尝试另一个列出的字体系列。使用通用字体系列作为第一个字体,然后使用相同字体系列作为其他选项是良好的编码实践。

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
高德地图升级方法汇总
高德地图升级方法汇总

本专题整合了高德地图升级相关教程,阅读专题下面的文章了解更多详细内容。

65

2026.01.16

全民K歌得高分教程大全
全民K歌得高分教程大全

本专题整合了全民K歌得高分技巧汇总,阅读专题下面的文章了解更多详细内容。

121

2026.01.16

C++ 单元测试与代码质量保障
C++ 单元测试与代码质量保障

本专题系统讲解 C++ 在单元测试与代码质量保障方面的实战方法,包括测试驱动开发理念、Google Test/Google Mock 的使用、测试用例设计、边界条件验证、持续集成中的自动化测试流程,以及常见代码质量问题的发现与修复。通过工程化示例,帮助开发者建立 可测试、可维护、高质量的 C++ 项目体系。

33

2026.01.16

java数据库连接教程大全
java数据库连接教程大全

本专题整合了java数据库连接相关教程,阅读专题下面的文章了解更多详细内容。

39

2026.01.15

Java音频处理教程汇总
Java音频处理教程汇总

本专题整合了java音频处理教程大全,阅读专题下面的文章了解更多详细内容。

19

2026.01.15

windows查看wifi密码教程大全
windows查看wifi密码教程大全

本专题整合了windows查看wifi密码教程大全,阅读专题下面的文章了解更多详细内容。

85

2026.01.15

浏览器缓存清理方法汇总
浏览器缓存清理方法汇总

本专题整合了浏览器缓存清理教程汇总,阅读专题下面的文章了解更多详细内容。

19

2026.01.15

ps图片相关教程汇总
ps图片相关教程汇总

本专题整合了ps图片设置相关教程合集,阅读专题下面的文章了解更多详细内容。

11

2026.01.15

ppt一键生成相关合集
ppt一键生成相关合集

本专题整合了ppt一键生成相关教程汇总,阅读专题下面的的文章了解更多详细内容。

47

2026.01.15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号