热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

html字体有哪些

在HTML网页设计中,字体样式的设置是最为基础的。网页中设置合适的字体,可以提高用户体验。那么字体的设置主要用到css中font-family和font-style等字体相关属性。
在HTML网页设计中,字体样式的设置是最为基础的。网页中设置合适的字体,可以提高用户体验。那么字体的设置主要用到css中font-family和font-style等字体相关属性。




    
    



字体系列

与CSS一起使用。两个常见的字体组合列表和五个通用后备字体系列。

一个serif字体家族列表!

font-family: Times, "Times New Roman", serif

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

一个sans-serif字体家族列表!

font-family: Helvetica, Arial, sans-serif

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

serif通用字体系列!

font-family: serif

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

sans-serif通用字体系列!

font-family: sans-serif

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

等宽通用字体系列!

font-family: monospace

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

草书字体家族!

font-family: cursive

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为font-weight: 100; 正常字体样式!

幻想通用字体系列!

font-family: fantasy

斜体字体! 字体样式为font-style: oblique; 字体样式为font-weight: bold; 字体样式为It sucks in with a 100 font-weight! 正常字体样式!

前台效果如下图:

font-family 规定元素的字体系列。font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个。也就是说,font-family 属性的值是用于某个元素的字体族名称或/及类族名称的一个优先表。浏览器会使用它可识别的第一个值。

有两种类型的字体系列名称:

指定的系列名称:具体字体的名称,比如:"times"、"courier"、"arial"。

通常字体系列名称:比如:"serif"、"sans-serif"、"cursive"、"fantasy"、"monospace"

提示:使用逗号分割每个值,并始终提供一个类族名称作为最后的选择。

注意:使用某种特定的字体系列(Geneva)完全取决于用户机器上该字体系列是否可用;这个属性没有指示任何字体下载。因此,强烈推荐使用一个通用字体系列名作为后路。

font-style 属性定义字体的风格。该属性设置使用斜体、倾斜或正常字体。斜体字体通常定义为字体系列中的一个单独的字体。理论上讲,用户代理可以根据正常字体计算一个斜体字体。

本篇就是关于HTML字体有哪些的相关介绍,希望对需要的朋友有所帮助!

以上就是html字体有哪些的详细内容,更多请关注 第一PHP社区 其它相关文章!


推荐阅读
  • Mysqlcheck作为MySQL提供的一个实用工具,主要用于数据库表的维护工作,包括检查、分析、修复及优化等操作。本文将详细介绍如何使用Mysqlcheck工具,并提供一些实践建议。 ... [详细]
  • LIN总线技术详解
    LIN(Local Interconnect Network)总线是一种基于UART/SCI(通用异步收发器/串行接口)的低成本串行通信协议,主要用于汽车车身网络中智能传感器和执行器之间的通信。 ... [详细]
  • 在使用KVM虚拟化技术通过NAT模式启动虚拟机时,可能会遇到qemu-ifup-nat脚本执行失败的错误。本文将详细介绍如何诊断和解决这一问题。 ... [详细]
  • 本文介绍了Linux内核中TCP的三种接收队列:Prequeue、sk_receive_queue和Backlog。这些队列在数据包处理过程中扮演着重要角色,帮助提高系统性能和效率。 ... [详细]
  • Redis: 高效的键值存储系统
    Redis是一款遵循BSD许可的开源高性能键值存储系统,它不仅支持多种数据类型的存储,还提供了数据持久化和复制等功能,显著区别于其他键值缓存解决方案。 ... [详细]
  • 第1章选择流程控制语句1.1顺序结构的基本使用1.1.1顺序结构概述是程序中最简单最基本的流程控制,没有特定的语法结构,按照代码的先后顺序,依次执行,程序中大多数的代码都是这样执行 ... [详细]
  • 现在的新手程序猿,动不动就是框架,就连外面培训的也是框架,我就问一句,没了框架是不是就啥也不会了 ... [详细]
  • 本文介绍了一个基本的同步Socket程序,演示了如何实现客户端与服务器之间的简单消息传递。此外,文章还概述了Socket的基本工作流程,并计划在未来探讨同步与异步Socket的区别。 ... [详细]
  • 使用IntelliJ IDEA高效开发与运行Shell脚本
    本文介绍了如何利用IntelliJ IDEA中的BashSupport插件来增强Shell脚本的开发体验,包括插件的安装、配置以及脚本的运行方法。 ... [详细]
  • ED Tree HDU4812 点分治+逆元
    这道题非常巧妙!!!我们进行点分治的时候,算出当前子节点的所有子树中的节点,到当前节点节点的儿子节点的距离,如下图意思就是当前节点的红色节点,我们要求出红色节点的儿子节点绿色节点, ... [详细]
  • IIS6批量添加主机头,修改IIS数据库
    首先,找到IIS的数据库。默认是在C:\WINDOWS\system32\inetsrv下的MetaBase.xml文件。如果找不到,请右键右键站点-》所有服务-》将配置保存到一个 ... [详细]
  • 本文详细介绍了Python中的生成器表达式、列表推导式、字典推导式及集合推导式等,探讨了它们之间的差异,并提供了丰富的代码示例。 ... [详细]
  • 本文介绍了基于Java的在线办公工作流系统的毕业设计方案,涵盖了MyBatis框架的应用、源代码分析、调试与部署流程、数据库设计以及相关论文撰写指导。 ... [详细]
  • 利用Cookie实现用户登录状态的持久化
    本文探讨了如何使用Cookie技术在Web应用中实现用户登录状态的持久化,包括Cookie的基本概念、优势及主要操作方法,并通过一个简单的Java Web项目示例展示了具体实现过程。 ... [详细]
  • 本文深入分析了在使用JavaScript中的Date.UTC()方法初始化Date对象时,getDay()方法返回值与预期不符的原因,并提供了相应的解决方案。 ... [详细]
author-avatar
手机用户2502938443
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有