🌹 喇賽的人 Blog 🌹

🌹 喇低喇賽 🌹

0%

修正 udemy 簡體字幕粗細不一

亂寫於 Disqus：
廢話字數： 1.7k 所需傷眼時間 ≈ 2 分鐘

 

看 udemy 影片常常需要搭配字幕, 可是簡體字都會用一種很殘的粗細不一來顯示, 問 AI 來搞個 extension 修正

manifest.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{
  "manifest_version": 3,
  "name": "Udemy 字體優化 (微軟正黑體)",
  "version": "1.1",
  "description": "強制將 Udemy 網頁字體替換為微軟正黑體",
  "content_scripts": [
    {
      "matches": ["https://www.udemy.com/*"],
      "css": ["style.css"],
      "run_at": "document_start",
      "all_frames": true
    }
  ]
}

style.css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
/* 1. 全域字體替換：使用 400 (Regular) 字重 */
*:not([class*="icon"]):not(i) {
    font-family: "Segoe UI", "Inter", "Microsoft YaHei", "微軟雅黑", "Microsoft JhengHei", sans-serif !important;
    font-weight: 400; /* 預設回標準厚度 */
    
    /* 讓字體更平滑的渲染屬性 */
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
}

/* 2. 保留標題的粗度：讓層次分明，不至於整頁都一樣細 */
h1, h2, h3, h4, 
[class*="heading"], 
[class*="title--"],
.ud-heading-md, .ud-heading-lg {
    font-weight: 700 !important; /* 標題維持粗體 */
}

/* 3. 影片字幕優化：調成 400 或 500 即可，不要 600 */
.well--text--J1-Qi, 
.well--container--afdWD span,
[class*="captions-display--"] {
    font-family: "Segoe UI", "Microsoft YaHei", sans-serif !important;
    font-weight: 450 !important; /* 介於標準與中等之間，最適合閱讀 */
    line-height: 1.4 !important;
    letter-spacing: 0.02em !important;
    /* 減輕陰影，讓字體看起來更乾淨 */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8) !important;
}

/* 4. 暴力覆蓋 Udemy 內建字型定義 */
@font-face {
    font-family: 'Udemy Sans';
    src: local("Microsoft YaHei"), local("Segoe UI");
}
關閉