惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Jina AI
Jina AI
N
Netflix TechBlog - Medium
P
Proofpoint News Feed
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
D
DataBreaches.Net
人人都是产品经理
人人都是产品经理
aimingoo的专栏
aimingoo的专栏
Stack Overflow Blog
Stack Overflow Blog
Blog — PlanetScale
Blog — PlanetScale
月光博客
月光博客
阮一峰的网络日志
阮一峰的网络日志
I
InfoQ
F
Fortinet All Blogs
J
Java Code Geeks
Last Week in AI
Last Week in AI
美团技术团队
大猫的无限游戏
大猫的无限游戏
有赞技术团队
有赞技术团队
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
博客园_首页
量子位
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Apple Machine Learning Research
Apple Machine Learning Research
小众软件
小众软件

Taxodium

用 Tamper-monkey 集成 Kagi Translate (2) Zine#58 辣椒炒肉 用 Tamper-monkey 集成 Kagi Translate TIL:Punycode Zine#57 香港雞公嶺 給博客添加純文本版本 在 Emacs 中用漢典查詢倉頡碼 Album#48 Album#47 Re: Bloggers, can we make better titles for our posts? Album#46 Zine#56 Blaugust 2026 Feeds Album#45 Album#44 Zine#55 Album#43 請開啟 JavaScript 以繼續搜尋 近期觀影 小象超市鮮啤簡評 Zine#54 Zine#53 Elfeed 4.0.0 使用分享 分享一些 Zen 瀏覧器好用的功能 Zine#52 Zine#51 Album#42 上手倉頡輸入法
TIL: lang 属性會影响文字的尺寸
Spike Leung · 2026-07-13 · via Taxodium

你可以點開下面的兩個視頻,觀察一下頁面切換時导航的變化。當切換頁面导航時,發現导航处的文字樣式有變化,但兩個頁面的导航是一樣的,理論上說切換時不應該有樣式變化的。

在 Zen 瀏覧器上切換导航里的頁面,可以看到在頁面切換時,連結下的下划綫長度會變化。
在 Safari 瀏覧器上切換导航里的頁面,可以看到在頁面切換時,連結的字體大小會變化。

定位了好久,我先查看了元素尺寸,發現切換時確實存在細微的尺寸變化;然後我開始排查樣式,是不是主頁里有額外的樣式?是不是导航的樣式寫的有問題?有什麼語法用的不對?調了半天還是沒有頭續。

但兩個頁面有這樣的差导肯定有原因,我開始對比兩個 HTML 的差异,把大量无關的 HTML 刪除,只剩导航,問題依然存在。最後我看到兩個頁面的唯一差异是設置在 <html> 元素上的 lang ,在主頁是 <html lang="en"> ,而其他頁面都是 <html lang="zh-CN"> 。把主頁的 lang 修正為 zh-CN ,問題解决了。

之前在加 pagefind 搜索功能 時我把所有頁面的 lang 都改成了 zh-CN ,看來還是改漏了。我以為 lang 只是對屏幕閱讀有影響,沒想到還影响了文字顯示。

這是因為瀏覧器會根據頁面上設置的 lang 去找合適的字體 (font-family),而我也沒有設置中文字體,而是由瀏覧器自己找,這就导致了 lang 不同時,應用的字體存在差异,表現出來的就是尺寸的變化。

Webmentions (加载中...)

如果你想回应这篇文章,可以在你的文章或社交媒体帖子中链接这篇文章,然后提交你的 URL,你的回应随后会显示在此页面上。 (关于 Webmention)