当前位置: 首页 > article >正文

同样的html标记,不同语言的文本,显示的字体和粗细会不一样吗

同样的 HTML 标记,在不同语言的文本下,显示出来的字体和粗细确实可能会不一样,原因如下:


🌍 不同语言默认字体不同

  1. 浏览器字体回退机制
    CSS 里写的字体如果当前系统不支持,就会回退到下一个,比如:

    font-family: "Arial", "Helvetica", sans-serif;
    
    • 中文常常会回退到 SimSun, Microsoft YaHei, Noto Sans SC 等。
    • 英文常用的是 Arial, Times New Roman, Roboto, Helvetica 等。
    • 如果没有指定多语言支持的字体,不同语言显示时就会使用不同系统默认字体。
  2. 字体对语言的支持不一致
    某些西文字体(如 Arial)对中文的支持很差,显示中文时会被系统自动替换成其他字体。


🧱 字体设计本身差异(含粗细)

  • 中文字体和西文字体的字重定义不一样。比如:

    • 英文字体的 font-weight: 400 看起来很细;
    • 中文字体即使是 400,在视觉上也比英文粗很多(尤其像“微软雅黑”)。
    • 有些字体的 bold 效果也会因语言不同表现出强弱不一的加粗。

🔤 字体渲染差异

  • 操作系统(Windows, macOS, Linux)和浏览器(Chrome, Safari, Firefox)对字体的渲染方式也会有区别,特别是对于非拉丁文字(中文、日文、韩文等)。

✅ 示例对比

<p style="font-family: Arial; font-weight: 400;">This is English text.
</p>
<p style="font-family: Arial; font-weight: 400;">这是中文文本。
</p>

同样的 Arialfont-weight: 400,你会发现英文是细的,而中文可能是另一种字体、而且看起来更粗。


🛠 如何统一字体效果?

如果你希望中文和英文看起来尽量一致,可以使用专门设计为多语言统一风格的字体,比如:

  • Noto Sans / Noto Sans SC
  • Microsoft YaHei UI
  • PingFang SC (macOS 中文)
  • Roboto + Noto Sans CJK

并通过 CSS 指定更细致的字体设置,例如:

body {font-family: 'Noto Sans', 'Noto Sans SC', sans-serif;font-weight: 400;
}

相关文章:

同样的html标记,不同语言的文本,显示的字体和粗细会不一样吗

同样的 HTML 标记&#xff0c;在不同语言的文本下&#xff0c;显示出来的字体和粗细确实可能会不一样&#xff0c;原因如下&#xff1a; &#x1f30d; 不同语言默认字体不同 浏览器字体回退机制 CSS 里写的字体如果当前系统不支持&#xff0c;就会回退到下一个&#xff0c;比如…...

JavaScript 笔记 --- part 5 --- Web API (part 3)

(webAPI part3) BOM 操作 JS 执行机制 javascript 是单线程的, 也就是说, 只能同时执行一个任务。 为了解决这个问题, 利用多核 CPU 的计算能力, HTML5 提出 Web Worker API, 允许 JavaScript 脚本创建多个线程, 并将任务分配给这些线程。 于是, JS 出现了同步和异步的概念。…...

Linux 下的网络管理(附加详细实验案例)

一、简单了解 NM&#xff08;NetworkManager&#xff09; 在 Linux 中&#xff0c;NM 是 NetworkManager 的缩写。它是一个用于管理网络连接的守护进程和工具集。 在 RHEL9 上&#xff0c;使用 NM 进行网络配置&#xff0c;ifcfg &#xff08;也称为文件&#xff09;将不再…...

基于SpringBoot的疫情居家检测管理系统(源码+数据库)

514基于SpringBoot的疫情居家检测管理系统&#xff0c;系统包含三种角色&#xff1a;管理员、用户、医生&#xff0c;主要功能如下。 【用户功能】 1. 首页&#xff1a;获取系统信息。 2. 论坛&#xff1a;参与居民讨论和分享信息。 3. 公告&#xff1a;查看社区发布的各类公告…...

关于系统架构思考,如何设计实现系统的高可用?

绪论、系统高可用的必要性 系统高可用为了保持业务连续性保障&#xff0c;以及停机成本量化&#xff0c;比如在以前的双十一当天如果出现宕机&#xff0c;那将会损失多少钱&#xff1f;比如最近几年Amazon 2021年30分钟宕机损失$5.6M。当然也有成功的案例&#xff0c;比如异地…...

MATLAB 控制系统设计与仿真 - 35

MATLAB鲁棒控制器分析 所谓鲁棒性是指控制系统在一定(结构&#xff0c;大小)的参数扰动下&#xff0c;维持某些性能的特征。 根据对性能的不同定义&#xff0c;可分为稳定鲁棒性(Robust stability)和性能鲁棒性(Robust performance)。 以闭环系统的鲁棒性作为目标设计得到的…...

性能比拼: Nginx vs Caddy

本内容是对知名性能评测博主 Anton Putra Nginx vs Caddy Performance 内容的翻译与整理, 有适当删减, 相关指标和结论以原作为准 引言 在本期视频中&#xff0c;我们将对比 Nginx 和 Caddy---一个用 Go 编写的 Web 服务器和反向代理。 在第一个测试中&#xff0c;我们会使用…...

C++项目-衡码云判项目演示

衡码云判项目是什么呢&#xff1f;简单来说就是这是一个类似于牛客、力扣等在线OJ系统&#xff0c;用户在网页编写代码&#xff0c;点击提交后传递给后端云服务器&#xff0c;云服务器将用户的代码和测试用例进行合并编译&#xff0c;返回结果到网页。 项目最大的两个亮点&…...

李宏毅NLP-6-seq2seqHMM

比较seq2seq和HMM Hidden Markov Model(HMM) 隐马尔可夫模型&#xff08;HMM&#xff09;在语音识别中的应用&#xff0c;具体内容如下&#xff1a; 整体流程&#xff1a; 左侧为语音信号&#xff08;标记为 “speech”&#xff09;&#xff0c;其特征表示为 X X X。中间蓝色模…...

百度暑期实习岗位超3000个,AI相关岗位占比87%,近屿智能携AIGC课程加速人才输出

今年3月&#xff0c;百度重磅发布3000暑期实习岗位&#xff0c;聚焦大模型、机器学习、自动驾驶等AI方向的岗位比例高达87%。此次实习岗位涉及技术研发、产品策划、专业服务、管理支持、政企解决方案等四大类别&#xff0c;覆盖超300个岗位细分方向。值得一提的是&#xff0c;百…...

【技术派后端篇】基于 Redis 实现网站 PV/UV 数据统计

在网站的数据分析中&#xff0c;PV&#xff08;Page View&#xff0c;页面浏览量&#xff09;和 UV&#xff08;Unique Visitor&#xff0c;独立访客数&#xff09;是两个重要的指标&#xff0c;几乎每个网站都需要对其进行统计。市面上有很多成熟的统计产品&#xff0c;例如百…...

JAVA:利用 Apache Tika 提取文件内容的技术指南

1、简述 Apache Tika 是一个强大的工具,用于从各种文件中提取内容和元数据。📄Tika 支持解析文档、📸图像、🎵音频、🎥视频文件以及其他多种格式,非常适合构建🔍搜索引擎、📂内容管理系统和📊数据分析工具。 样例代码:https://gitee.com/lhdxhl/springboot-…...

【AI】SpringAI 第二弹:接入 DeepSeek 官方服务

一、接入 DeepSeek 官方服务 通过一个简单的案例演示接入 DeepSeek 实现简单的问答功能 1.添加依赖 <dependency><groupId>org.springframework.ai</groupId><artifactId>spring-ai-starter-model-openai</artifactId> </dependency> 2…...

XMLXXE 安全无回显方案OOB 盲注DTD 外部实体黑白盒挖掘

# 详细点&#xff1a; XML 被设计为传输和存储数据&#xff0c; XML 文档结构包括 XML 声明、 DTD 文档类型定义&#xff08;可 选&#xff09;、文档元素&#xff0c;其焦点是数据的内容&#xff0c;其把数据从 HTML 分离&#xff0c;是独立于软件和硬件的 信息传输…...

SQL之DML(查询语句:select、where)

&#x1f3af; 本文专栏&#xff1a;MySQL深入浅出 &#x1f680; 作者主页&#xff1a;小度爱学习 select查询语句 在开发中&#xff0c;查询语句是使用最多&#xff0c;也是CRUD中&#xff0c;复杂度最高的sql语句。 查询的语法结构 select *|字段1 [, 字段2 ……] from 表…...

Oracle--用户管理

前言&#xff1a;本博客仅作记录学习使用&#xff0c;部分图片出自网络&#xff0c;如有侵犯您的权益&#xff0c;请联系删除 用户管理在 Oracle 数据库中至关重要。一个服务器通常只运行一个 Oracle 实例&#xff0c;而一个 Oracle 用户代表一个用户群&#xff0c;他们通过该用…...

MYDB仿MySQL手写数据库项目总结

声明&#xff1a;该项目是一个开源项目&#xff0c;我是在学习该项目&#xff0c;该项目的github地址如下&#xff1a; MYDB项目地址&#xff1a;https://github.com/CN-GuoZiyang/MYDB MYDB项目采用C/S结构&#xff0c;支持启动一个服务器&#xff0c;并有多个客户端去连接…...

24.中医知识问答删除历史对话功能前端代码实现

前端实现对话删除功能的完整指南 功能概述 前篇文章介绍了删除历史对话的后端开发&#xff0c;本篇将介绍如何在前端实现一个完整的对话删除功能&#xff0c;包括用户确认、API调用、状态管理和错误处理等关键环节。 功能拆解 1. 用户确认机制 javascript const confirmDe…...

git忽略已跟踪的文件/指定文件

在项目开发中&#xff0c;有时候我们并不需要git跟踪所有文件&#xff0c;而是需要忽略掉某些指定的文件或文件夹&#xff0c;怎么操作呢&#xff1f;我们分两种情况讨论&#xff1a; 1. 要忽略的文件之前并未被git跟踪 这种情况常用的方法是在项目的根目录下创建和编辑.gitig…...

RAG(检索增强生成)、ReAct(推理与行动) 和 多模态AI 的详细解析,包括三者的定义、工作原理、应用场景及协同关系

以下是 RAG&#xff08;检索增强生成&#xff09;、ReAct&#xff08;推理与行动&#xff09; 和 多模态AI 的详细解析&#xff0c;包括三者的定义、工作原理、应用场景及协同关系&#xff1a; 一、RAG&#xff08;Retrieval-Augmented Generation&#xff09; 1. 核心原理 …...

6.QT-常用控件-QWidget|windowTitle|windowIcon|qrc机制|windowOpacity|cursor(C++)

windowTitle API说明windowTitle()获取到控件的窗⼝标题.setWindowTitle(const QString& title)设置控件的窗⼝标题. 注意!上述设置操作针对不同的widget可能会有不同的⾏为. 如果是顶层widget(独⽴窗⼝),这个操作才会有效. 如果是⼦widget,这个操作⽆任何效果. 代码⽰例…...

Excel/WPS表格中图片链接转换成对应的实际图片

Excel 超链图变助手&#xff08;点击下载可免费试用&#xff09; 是一款将链接转换成实际图片&#xff0c;批量下载表格中所有图片的转换工具&#xff0c;无需安装&#xff0c;双击打开即可使用。 表格中链接如下图所示&#xff1a; 操作方法&#xff1a; 1、双击以下图标&a…...

PostgreSQL基础

一、PostgreSQL介绍 PostgreSQL是一个功能强大的 开源 的关系型数据库。底层基于C实现。 PostgreSQL的开源协议和Linux内核版本的开源协议是一样的。。BDS协议&#xff0c;这个协议基本和MIT开源协议一样&#xff0c;说人话&#xff0c;就是你可以对PostgreSQL进行一些封装&a…...

win11修改文件后缀名

一、问题描述 win11系统中&#xff0c;直接添加.py后缀后仍然是txt文本文件 二、处理方式&#xff1a; 点击上方三个小点点击“选项”按钮 点击“查看”取消“隐藏已知文件类型的扩展名”选项点击“应用” 此时&#xff0c;“.txt”文件后缀显示出来了。将txt删去&#xff0c…...

【python实用小脚本系列】用Python打造你的专属智能语音助手

用Python打造你的专属智能语音助手 在科技飞速发展的今天&#xff0c;语音助手已经成为了我们生活中的“小帮手”。无论是苹果的Siri&#xff0c;还是亚马逊的Alexa&#xff0c;它们都能通过语音指令帮我们完成各种任务。今天&#xff0c;我来给大家分享一个用Python打造的简单…...

《Java工程师面试核心突破》专栏简介

《Java工程师面试核心突破》专栏简介 &#x1f525; 大厂Offer收割机 | 源码级技术纵深 | 90%高频考点覆盖 专栏定位 「拒绝八股文&#xff0c;直击技术本质」 本专栏专为Java中高级工程师量身定制&#xff0c;通过6大核心模块、30个硬核专题&#xff0c;系统性拆解大厂面试…...

Navicat连接数据库密码忘了如何解析

1、首先打开Navicat导出密码 打开文件---》导出链接----》选择连接并勾选导出密码 2、用编辑器打开复制密码 把password后面的密码复制出来 3、打开php编辑器&#xff0c;我这边因为平时不用就在网上找了一个在线编辑器 地址: https://www.w3cschool.cn/tryrun/runcode?la…...

OpenStack Yoga版安装笔记(22)Swift笔记20250418

一、官方文档 https://docs.openstack.org/swift/yoga/admin/objectstorage-components.html#https://docs.openstack.org/swift/yoga/admin/objectstorage-components.html# 二、对象存储简介&#xff08;Introduction to Object Storage&#xff09; OpenStack 对象存储&a…...

基于若依的ruoyi-vue-plus的nbmade-boot在线表单的设计(七)后端方面的设计

希望大家一起能参与我的新开源项目nbmade-boot: 宁波智能制造低代码实训平台 主要目标是类似设计jeecgboot那样的online表单功能,因为online本身没有开源这部分代码,而我设计这个是完全开源的,所以希望大家支持支持,开源不容易。 今天主要是讲后端部门之前漏的文件。 下面主…...

18、TimeDiff论文笔记

TimeDiff **1. 背景与动机****2. 扩散模型基础****3. TimeDiff 模型****3.1 前向扩散过程****3.2 后向去噪过程** 4、TimeDiff&#xff08;架构&#xff09;原理训练推理其他关键点解释 DDPM&#xff08;相关数学&#xff09;1、正态分布2、条件概率1. **与多个条件相关**&…...