網頁使用微軟正黑體bug

維克 (Vic Lin)-avatar-img
維克 (Vic Lin)
更新於 發佈於 閱讀時間約 1 分鐘

最近遇到客戶姓名中有"碧"這個字，發現後面會多一格空白:

raw-image

google了一下，改成用font-face的解法，發現碧後面還是會有一點點空格:

raw-image


既然這是微軟正黑體粗體的bug，就直接把粗體改掉吧，font-weight設為500，就正常了，或者是換別的字型也是一種解法。

raw-image


本筆記參考:
1. https://kira5033.github.io/2020/05/%E7%A2%A7%E7%AD%B5%E7%B6%B0%E5%9C%A8%E5%BE%AE%E8%BB%9F%E6%AD%A3%E9%BB%91%E9%AB%94%E5%95%8F%E9%A1%8C/
2. https://lininu.blogspot.com/2016/01/blog-post.html

留言
avatar-img
留言分享你的想法！
avatar-img
Vic Lin的沙龍
20會員
161內容數
Vic Lin的沙龍的其他內容
2023/08/13
Vue 3.2 defineEmits 用法
父元件 傳遞方法使用@ <template>    ...    <Login @modalClose="modalClose"/> ... </template> <script setup>     const _modal = ref();     function m
2023/08/13
Vue 3.2 defineEmits 用法
父元件 傳遞方法使用@ <template>    ...    <Login @modalClose="modalClose"/> ... </template> <script setup>     const _modal = ref();     function m
2023/03/25
ASRock AMD DeskMini X300 超高CP自組筆記
前情提要 由於我的筆電已經用了10年，無法再戰下去了，且有預算考量，加上使用電腦幾乎都是定點，只有偶爾回家的時候會需要攜帶，因此最終選擇了迷你電腦，體積小不占空間，又方便攜帶，剛好符合我的需求。 菜單 由於這台無法裝獨顯，所以CPU的部分選擇 AMD R5 3400G(含Vega 11內
Thumbnail
2023/03/25
ASRock AMD DeskMini X300 超高CP自組筆記
前情提要 由於我的筆電已經用了10年，無法再戰下去了，且有預算考量，加上使用電腦幾乎都是定點，只有偶爾回家的時候會需要攜帶，因此最終選擇了迷你電腦，體積小不占空間，又方便攜帶，剛好符合我的需求。 菜單 由於這台無法裝獨顯，所以CPU的部分選擇 AMD R5 3400G(含Vega 11內
Thumbnail
2023/03/10
Nuxt3 使用 useFetch 取得數據
Nuxt3中可使用useFetch來獲取數據，不須再引用axios，相當方便: 本筆記參考: https://juejin.cn/post/7104071421160063012 https://juejin.cn/post/7086472647575339045
2023/03/10
Nuxt3 使用 useFetch 取得數據
Nuxt3中可使用useFetch來獲取數據，不須再引用axios，相當方便: 本筆記參考: https://juejin.cn/post/7104071421160063012 https://juejin.cn/post/7086472647575339045
看更多
你可能也想看
Thumbnail
avatar-avatar
阿千看世界
2025年綜合所得稅繳稅教學：線上申報、信用卡回饋、拆單攻略！
每年4月、5月都是最多稅要繳的月份，當然大部份的人都是有機會繳到「綜合所得稅」，只是相當相當多人還不知道，原來繳給政府的稅！可以透過一些有活動的銀行信用卡或電子支付來繳，從繳費中賺一點點小確幸！就是賺個１%~2%大家也是很開心的，因為你們把沒回饋變成有回饋，就是用卡的最高境界 所得稅線上申報
#2025所得稅#綜合所得稅#繳稅有回饋
Thumbnail
avatar-avatar
阿千看世界
2025年綜合所得稅繳稅教學：線上申報、信用卡回饋、拆單攻略！
每年4月、5月都是最多稅要繳的月份，當然大部份的人都是有機會繳到「綜合所得稅」，只是相當相當多人還不知道，原來繳給政府的稅！可以透過一些有活動的銀行信用卡或電子支付來繳，從繳費中賺一點點小確幸！就是賺個１%~2%大家也是很開心的，因為你們把沒回饋變成有回饋，就是用卡的最高境界 所得稅線上申報
#2025所得稅#綜合所得稅#繳稅有回饋
Thumbnail
avatar-avatar
科技巨頭解碼
NVDA 25Q1 財報 - 扣除中國因素，輝達的前方仍然沒有烏雲 | #276
全球科技產業的焦點，AKA 全村的希望 NVIDIA，於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1，實際日曆期間為今年二到四月)，交出了打敗了市場預期的成績單。然而，在銷售持續高速成長的同時，川普政府加大對於中國的晶片管制......
#NVDA#NVIDIA#輝達
Thumbnail
avatar-avatar
科技巨頭解碼
NVDA 25Q1 財報 - 扣除中國因素，輝達的前方仍然沒有烏雲 | #276
全球科技產業的焦點，AKA 全村的希望 NVIDIA，於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1，實際日曆期間為今年二到四月)，交出了打敗了市場預期的成績單。然而，在銷售持續高速成長的同時，川普政府加大對於中國的晶片管制......
#NVDA#NVIDIA#輝達
Thumbnail
avatar-avatar
美股 Insight
6月Fed會議：略為鷹派收斂2026、2027年降息預期，繼續維持高利率更長時間的觀望態度
重點摘要： 6 月繼續維持基準利率不變，強調維持高利率主因為關稅 點陣圖表現略為鷹派，收斂 2026、2027 年降息預期 SEP 連續 2 季下修 GDP、上修通膨預測值 --- 1.繼續維持利率不變，強調需要維持高利率是因為關稅： 聯準會 (Fed) 召開 6 月利率會議
#Fed#聯準會#美股
Thumbnail
avatar-avatar
美股 Insight
6月Fed會議：略為鷹派收斂2026、2027年降息預期，繼續維持高利率更長時間的觀望態度
重點摘要： 6 月繼續維持基準利率不變，強調維持高利率主因為關稅 點陣圖表現略為鷹派，收斂 2026、2027 年降息預期 SEP 連續 2 季下修 GDP、上修通膨預測值 --- 1.繼續維持利率不變，強調需要維持高利率是因為關稅： 聯準會 (Fed) 召開 6 月利率會議
#Fed#聯準會#美股
Thumbnail
avatar-avatar
Lee Luciano的沙龍
星期三的CSS-CSSBattle#38
這篇文章分享了 CSS Battle 第 38 題的解法，並提供了相關的技術總結。文章內容包括了使用 flex 排版處理、背景漸層的方法處理等相關技術。透過這篇文章可以學習到如何解決 CSS 切版的問題。
#分享#文章#背景
Thumbnail
avatar-avatar
Lee Luciano的沙龍
星期三的CSS-CSSBattle#38
這篇文章分享了 CSS Battle 第 38 題的解法，並提供了相關的技術總結。文章內容包括了使用 flex 排版處理、背景漸層的方法處理等相關技術。透過這篇文章可以學習到如何解決 CSS 切版的問題。
#分享#文章#背景
Thumbnail
avatar-avatar
DavidHi的沙龍
SQL_解決語法更新中文顯示問號(?)的方法
在工作情境中手動執行SQL語法更新中文字時，有時會遇到中文字顯示問號(?)的情況。這篇文章將介紹如何解決手動執行SQL語法時造成中文顯示問號(?)的方法。
#SQL#語法#中文
Thumbnail
avatar-avatar
DavidHi的沙龍
SQL_解決語法更新中文顯示問號(?)的方法
在工作情境中手動執行SQL語法更新中文字時，有時會遇到中文字顯示問號(?)的情況。這篇文章將介紹如何解決手動執行SQL語法時造成中文顯示問號(?)的方法。
#SQL#語法#中文
Thumbnail
avatar-avatar
Warren Lo的沙龍
如何在多人工作站升級自己的 Python
IDE 升級後出現了一樣的錯誤，手上程式碼沒有 pylint black-format 檢查上不了 gitlab，我又點開了那個很小很小的 x 符號，裡面 logs 提示的解決方式是升級..
#python#venv#pylint
Thumbnail
avatar-avatar
Warren Lo的沙龍
如何在多人工作站升級自己的 Python
IDE 升級後出現了一樣的錯誤，手上程式碼沒有 pylint black-format 檢查上不了 gitlab，我又點開了那個很小很小的 x 符號，裡面 logs 提示的解決方式是升級..
#python#venv#pylint
Thumbnail
avatar-avatar
伶的星空
注音輸入法設定
為什麼寫這麼基本的設定呢? 剛開始打字時預設內定為微軟注音，因為沒有全部設定好，導致後續寫稿時常常打錯字，也有是因為打注音時選錯字也有關。 雖然這個很基本，但也有滿多人不知道該怎麼設定，或常被微軟裡其設定繁雜而困擾，至少我找了一陣子......。 進入畫面右下方切換中英文(右鍵)，叫出IME工
#注音#整合#科技力
Thumbnail
avatar-avatar
伶的星空
注音輸入法設定
為什麼寫這麼基本的設定呢? 剛開始打字時預設內定為微軟注音，因為沒有全部設定好，導致後續寫稿時常常打錯字，也有是因為打注音時選錯字也有關。 雖然這個很基本，但也有滿多人不知道該怎麼設定，或常被微軟裡其設定繁雜而困擾，至少我找了一陣子......。 進入畫面右下方切換中英文(右鍵)，叫出IME工
#注音#整合#科技力
Thumbnail
avatar-avatar
阿賢的沙龍
WIN10 微軟注音爆音 如何解決
打字爆音很討厭 三張圖教你怎麼解決 簡單不廢話 上圖!
#Win10#打字#安靜
Thumbnail
avatar-avatar
阿賢的沙龍
WIN10 微軟注音爆音 如何解決
打字爆音很討厭 三張圖教你怎麼解決 簡單不廢話 上圖!
#Win10#打字#安靜
Thumbnail
avatar-avatar
袋鼠Kangaroo's Blog
第一次安裝字體就上手！
「你是否覺得電腦的那些固定字體已經看膩了呢？」 「你是否覺得每次電腦只能用黑體、標楷體或是新細明體呢？」 那麼今天要來介紹一下，如何在網路上安裝其他的字體，以及介紹幾種安裝字體的網站唷～
#資訊科技#字型#下載
Thumbnail
avatar-avatar
袋鼠Kangaroo's Blog
第一次安裝字體就上手！
「你是否覺得電腦的那些固定字體已經看膩了呢？」 「你是否覺得每次電腦只能用黑體、標楷體或是新細明體呢？」 那麼今天要來介紹一下，如何在網路上安裝其他的字體，以及介紹幾種安裝字體的網站唷～
#資訊科技#字型#下載
Thumbnail
avatar-avatar
Vic Lin的沙龍
jsPDF中文亂碼
解決方法其實就是載入中文字型: 1. 到jsPDF的repo可以看到有fontconverter資料夾，裡面有fontconverter.html，選擇ttf字型檔，這邊以微軟正黑體為例: 2. 上一步會生成msjh-normal.js，在程式中要import(這邊是React)，接著設定這個字型
#jsPDF
Thumbnail
avatar-avatar
Vic Lin的沙龍
jsPDF中文亂碼
解決方法其實就是載入中文字型: 1. 到jsPDF的repo可以看到有fontconverter資料夾，裡面有fontconverter.html，選擇ttf字型檔，這邊以微軟正黑體為例: 2. 上一步會生成msjh-normal.js，在程式中要import(這邊是React)，接著設定這個字型
#jsPDF
Thumbnail
avatar-avatar
Vic Lin的沙龍
網頁使用微軟正黑體bug
最近遇到客戶姓名中有"碧"這個字，發現後面會多一格空白: google了一下，改成用font-face的解法，發現碧後面還是會有一點點空格: 既然這是微軟正黑體粗體的bug，就直接把粗體改掉吧，font-weight設為500，就正常了，或者是換別的字型也是一種解法。 本筆記參考: 1.
Thumbnail
avatar-avatar
Vic Lin的沙龍
網頁使用微軟正黑體bug
最近遇到客戶姓名中有"碧"這個字，發現後面會多一格空白: google了一下，改成用font-face的解法，發現碧後面還是會有一點點空格: 既然這是微軟正黑體粗體的bug，就直接把粗體改掉吧，font-weight設為500，就正常了，或者是換別的字型也是一種解法。 本筆記參考: 1.
Thumbnail
avatar-avatar
Kate的沙龍
個人網站1.3.0逐行解說
此版本的目標畫面成果是： ＊金色名字。 ＊金色社交按鈕圖示，點擊按鈕另開對應的網頁或著顯示comming soon。 ＊名字和按鈕在網頁中央，如果網頁寬度不夠會換行，夠就不換行。
#KotlinJS#程式設計#實戰
Thumbnail
avatar-avatar
Kate的沙龍
個人網站1.3.0逐行解說
此版本的目標畫面成果是： ＊金色名字。 ＊金色社交按鈕圖示，點擊按鈕另開對應的網頁或著顯示comming soon。 ＊名字和按鈕在網頁中央，如果網頁寬度不夠會換行，夠就不換行。
#KotlinJS#程式設計#實戰
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News