CSS花边001:无衬线字体和有衬线字体

网站中我们看到过很多字体,样子各有千秋。通常针对结构,区分为有衬字体(serif)无衬字体(sans-serif)。今天我们聊一下这个话题。

什么是有衬字体,什么是无衬字体?

在这里插入图片描述

衬线字体(serif)

衬线指的是字母结构笔画之外的装饰性笔画。

有衬线的字体叫衬线体(serif),在字的笔画开始、结束的地方有额外的装饰,而且笔画的粗细会有所不同。;

无衬线体(sans-serif)

没有衬线的字体,则叫做无衬线体(sans-serif),没有这些额外的装饰,而且笔画的粗细差不多。该类字体通常是机械的和统一线条的,它们往往拥有相同的曲率,笔直的线条,锐利的转角。。

各有哪些主要应用

衬线字体容易识别,它强调了每个字母笔画的开始和结束,因此易读性比较高。在整文阅读的情况下,适合使用serif字体进行排版,易于换行阅读的识别性,避免发生行间的阅读错误。

中文字体中的宋体就是一种最标准的serif字体,衬线的特征非常明显。字形结构也和手写的楷书一致。因此宋体一直被做为最适合的正文字体之一。

无衬线字体醒目,适合用于标题、DM、海报等,需要醒目但不需要长时间阅读的地方。但现在市场上很多app正文都开始采用无衬线字体,因为无衬线字体更简约、清新,比较有艺术感。

无衬线字体与汉字字体中的黑体相对应。为了起到醒目的作用,笔画比较粗,不适合长时间阅读,不适合用作正文字体。但是现代的 Macintosh、iOS、Android、Windows Vista 以上 等系统默认使用的无衬线字体基本上都是基于细黑体演化而来,不再像传统的无衬线字体那么重,因此用作正文字体时易读性也很高。

知名的无衬字体Helvetica

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/137414.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

sqli-labs关卡16(基于post提交的双引号加括号闭合的布尔盲注)通关思路

文章目录 前言一、回顾上一关知识点二、靶场第十六关通关思路1、判断注入点2、猜数据库长度3、猜数据库名字4、猜表名长度5、猜表名名字6、猜列名长度7、猜列名名字8、猜数据长度9、猜数据名字 总结 前言 此文章只用于学习和反思巩固sql注入知识,禁止用于做非法攻击…

已解决:java.net.BindException: 地址已在使用

解决zookeeper报错:java.net.BindException: 地址已在使用,是因为端口被占用。显示Starting zookeeper ... STARTED,jps没有QuorumPeerMain进程。 问题截图: 看似Starting zookeeper ... STARTED,实则集群并没有启动…

逻辑回归-癌症病预测与不均衡样本评估

1.注册相关库(在命令行输入) pip install scikit-learn pip install pandas pip install numpy 2.导入相关库 import pandas as pd import numpy as np from sklearn.metrics import classification_report from sklearn.model_selection import train_test_split…

【每日一题】—— B. Deja Vu(Codeforces Round 907 (Div. 2))(暴力枚举、队列)

🌏博客主页:PH_modest的博客主页 🚩当前专栏:每日一题 💌其他专栏: 🔴 每日反刍 🟡 C跬步积累 🟢 C语言跬步积累 🌈座右铭:广积粮,缓称…

“苹果定律”失效,2023是VR的劫点还是拐点?

因为Pico裁员的事情,VR行业又被讨论了。 Pico于2021年9月被字节跳动收购,当时是出货量排名全球第三的VR 头显生产商。 此前曾有国际机构预测,2023年随着Meta和Pico的硬件更新,苹果Vision Pro的推出,三星电子重新回归VR…

黑马程序员微服务Docker实用篇

Docker实用篇 0.学习目标 1.初识Docker 1.1.什么是Docker 微服务虽然具备各种各样的优势,但服务的拆分通用给部署带来了很大的麻烦。 分布式系统中,依赖的组件非常多,不同组件之间部署时往往会产生一些冲突。在数百上千台服务中重复部署…

初探地理编码(2023.11.12)

地理编码相识 2023.11.12 引言1、地理编码简介2、地理编码API和服务(解决方案供应商 / 厂商)2.1 高德2.2 百度2.3 超图2.4 天地图2.5 ArcGIS2.6 MapBox2.7 Cesium2.8 MapLocation 3、python实例3.1 pip安装依赖库(python 3.6)3.2 …

git分支与tag标签的介绍与使用)

git分支与tag标签的介绍与使用 一.什么是分支与标签1.2.开发环境分层 二git分支介绍2.1分支操作2.2.IDEA中操作分支 三、Git标签的讲解3.1.GitBashHere操作标签3.2. IDEA中操作标签 一.什么是分支与标签 分支(Branches): 功能开发&#xff…

Jenkins简介及Docker Compose部署

Jenkins是一个开源的自动化服务器,用于自动化构建、测试和部署软件项目。它提供了丰富的插件生态系统,支持各种编程语言和工具,使得软件开发流程更加高效和可靠。在本文中,我们将介绍Jenkins的基本概念,并展示如何使用…

PyCharm 安装库时显示连接超时

在setting->python Interpreter 中用“” 安装库时,出现一个弹窗,提示信息如下: Error updating package list: Connect timed out 通过查阅资料,发现是镜像源的问题,具体的解决方案如下: 1. 更新一下…

初始MySQL(四)(查询加强练习,多表查询(未完))

目录 查询加强 where加强 order by加强 group by 分页查询 总结 多表查询(重点) 笛卡尔集及其过滤 自连接 子查询 #先创建三张表 #第一张表 CREATE TABLE dept(deptno MEDIUMINT NOT NULL DEFAULT 0,dname VARCHAR(20) NOT NULL DEFAULT ,loc VARCHAR(13) NOT NULL D…

v-bind和v-model

目录 前言 v-bind 作用 语法格式 编译原理 简写 v-model 作用 使用方法 v-bind和v-model的区别和联系 前言 本文我们来了解一下模板语法之指令语法中的v-bind和v-model v-bind 作用 v-bind可以让html标签的某个属性的值产生动态的效果 语法格式 <html标签 v-bin…

菜单栏管理软件 Bartender 3 mac中文版功能介绍

​Bartender 3 mac是一款菜单栏管理软件&#xff0c;该软件可以将指定的程序图标隐藏起来&#xff0c;需要时呼出即可。 Bartender 3 mac功能介绍 Bartender 3完全支持macOS Sierra和High Sierra。 更新了macOS High Sierra的用户界面 酒吧现在显示在菜单栏中&#xff0c;使其…

Anolis 8.6 安装 Drawio

Anolis 8.6 安装 Drawio 22.1.0 一.RPM版&#xff08;不建议&#xff09;二.WAR 包部署 一.RPM版&#xff08;不建议&#xff09; Draw RPM 包下载链接 RPM 包直接基于Linux图形化能力部署&#xff0c;服务器类型的Linux系统启动RPM包安装的Draw可能比较复杂 系统版本 ## 1.…

如何配置Apple推送证书 push证书

转载&#xff1a;如何配置Apple推送证书 push证书 想要制作push证书&#xff0c;就需要使用快捷工具appuploader工具制 作证书&#xff0c;然后使用Apple的推送功能配置push证书&#xff0c;就可以得到了。PS&#xff1a;push没有描述文件&#xff0c;所以不 要问推送选择哪…

springboot苍穹外卖实战:十、缓存菜品(手动用redisTemplate实现缓存逻辑)+缓存套餐(Spring cache实现)

缓存菜品 缺点 缓存和数据库的数据一致性通常解决方案&#xff1a;延时双删、异步更新缓存、分布式锁。 该项目对于缓存菜品的处理较为简单&#xff0c;实际可以用管道技术提高redis的操作效率、同时cache自身有注解提供使用。 功能设计与缓存设计 建议这部分去看下原视频&…

登顶request模块

华子目录 Requests介绍安装requests模块常用方法常用属性实例引入各种请求方式基于get请求带参数的get请求推荐写法 基于post请求添加headers信息content获取二进制数据bytes类型获取json数据第一种方式第二种方式 response响应状态码判断 高级操作会话维持通过cookie维持会话通…

继承

文章目录 引出继承继承的概念继承的限制一个子类只能够继承一个父类&#xff0c;存在单继承局限。无法直接继承私有属性继承关系中&#xff0c;先构造父类&#xff0c;再构造子类 引出继承 Animal类 class Animal {private String name;private int age;public String getNam…

ChatGPT 4 分析天猫双十一历年成交额趋势情况

收集历年的双十一成交额数据如下: 年份成交额:亿元20090.520109.362011

vmware workstation 与 device/credential guard 不兼容

VM虚拟机报错 vmware虚拟机启动时报错&#xff1a;vmware workstation 与 device/credential guard 不兼容&#xff1a; 系统是win10专业版&#xff0c;导致报错原因最终发现是安装了docker&#xff0c;docker自带下载虚拟机Hyper-V&#xff0c;而导致vmware workstation 与 …