meta data for this page
差異處
這裏顯示兩個版本的差異處。
| 下次修改 | 前次修改 | ||
|
blog:2020:12:13-word-card [2020/12/13 06:49] 127.0.0.1 外部編輯 |
blog:2020:12:13-word-card [2022/11/18 23:23] (目前版本) ghsrobert ↷ 鏈結因頁面移動而自動修正 |
||
|---|---|---|---|
| 行 3: | 行 3: | ||
| 技術拆解/, | 技術拆解/, | ||
| - | - [[BlueGriffon]] = __HTML 編輯器__,自不待言 | + | - [[web-designing: |
| - 先把 100 多個字串打好(共 22 種不同的韻尾。其實這步本來也可以用試算表輔助複製相同的韻尾來加速的,但我打字很快就打完了 XD) | - 先把 100 多個字串打好(共 22 種不同的韻尾。其實這步本來也可以用試算表輔助複製相同的韻尾來加速的,但我打字很快就打完了 XD) | ||
| - 打完字後用 Sublime Text regex 全部轉成 ``div.card``⭐,就丟到 BlueGriffon 裡開始設定 CSS:< | - 打完字後用 Sublime Text regex 全部轉成 ``div.card``⭐,就丟到 BlueGriffon 裡開始設定 CSS:< | ||
| 行 16: | 行 16: | ||
| - 想用清楚、好看的粗體 sans-serif 字型: | - 想用清楚、好看的粗體 sans-serif 字型: | ||
| - 先用 Typeface 找系統現有 → 仍不滿意 | - 先用 Typeface 找系統現有 → 仍不滿意 | ||
| - | - → 上 FontSquirrel 很快就從 ``Bold`` 標籤中找到↓< | + | - → 上 FontSquirrel 很快就從 ``Bold`` 標籤中找到一個字型並下載安裝↓<code css> |
| font-family: | font-family: | ||
| - | * ⭐順便還把該網頁用 [[mao> | + | * ⭐順便還把該字型網頁用 [[mao> |
| - 巧皇后本來還交代希望「同韻」的單字要有相同的文字顏色,以便分類 ← 我本來抱怨太麻煩,否決掉((大膽,不要命了 XD))\\ 後來想到,只要用把同韻的 card 都加上相同的 class 再用 CSS 賦予個別的文字 color 就好,那 HTML 編輯方式很簡單,一樣用 regex 搜出同韻的各行,再把該韻加上 class 即可 | - 巧皇后本來還交代希望「同韻」的單字要有相同的文字顏色,以便分類 ← 我本來抱怨太麻煩,否決掉((大膽,不要命了 XD))\\ 後來想到,只要用把同韻的 card 都加上相同的 class 再用 CSS 賦予個別的文字 color 就好,那 HTML 編輯方式很簡單,一樣用 regex 搜出同韻的各行,再把該韻加上 class 即可 | ||
| - 本來要用 Sublime Text 把 22 種韻尾取代 22 輪的 | - 本來要用 Sublime Text 把 22 種韻尾取代 22 輪的 | ||
| 行 38: | 行 38: | ||
| } | } | ||
| </ | </ | ||
| + | * 學到試試 '' | ||
| + | #container { | ||
| + | width: 21cm; | ||
| + | } | ||
| + | </ | ||
| + | * 後來改為 '' | ||
| + | * 不過列印時有超出去邊界 → 再學到在列印 dialog 中設定 fit content to page width(([[g> | ||
| </ | </ | ||
| {{tag> | {{tag> | ||