一、前言
大家不論學習什麼程式語言、選擇走前端後端或系統分析,一定都學過HTML這個文本標記語言,當然隨著語言不同可能檔案副檔名與註解方式不一樣,這篇想跟大家分享關於它的一些冷知識,個人覺得有些滿實用的唷!
二、HTML裡的符號
因為我很常使用 Markdown 語法做筆記或會議記錄,甚至近期已經著迷到會用它做旅遊規劃的慾望清單XD所以難免在日常累積中,會有需要用到特殊符號的需求,以下分享一些我個人搜集並常常使用的網站資源。
項次 | 符號種類 | 說明 |
---|---|---|
1 | 基本常見的字母或特殊字元 | 就是日常會用到的,這個網站都有唷~ |
2 | 非常齊全、並意想不到的符號 | 左側有功能選單,非常清楚明瞭,可以組出特別的想法們 |
3 | 常見和冷門的符號 | 有提供UNICODE、HEX CODE和HTML CODE,是我個人最常使用的查詢網站。我覺得很多都很可愛,像是雪人 ☃ |
4 | HTML的數學特殊符號 | 像是 ∑ |
5 | 基本且常見的實用符號 | 像是版權的© 或是基本的箭頭符號 → |
三、HTML裡的空格
大家應該有遇過想在 markdown 語法裡,適當地呈現文字縮排、空格的方法吧?一般來說,大多數的文字編輯器介面可能不支援我們所熟悉的空白鍵,會看不出效果。還有其他需要使用的狀況,大家可以參考以下我統整HTML 裡 entity 的語法與示範,了解一下實際運用的效果唷~
entity語法 | 作用 | 範例程式碼 | 範例效果 |
---|---|---|---|
  |
全形空格,1個中文字的寬度 | 「」可以注意到我的每個段落開頭都有 |
「」可以注意到我的每個段落開頭都有 |
  |
半形空格,半個中文字的寬度 | 「 」有時候排版需要縮排可以使用 |
「 」有時候排版需要縮排可以使用 |
|
按空白鍵產生的空格 | 大家最熟悉的「 」距離? |
大家最熟悉的「 」距離? |
  |
窄空格,約1/6個中文字的寬度 | 大概是一種曖昧「 」距離? |
大概是一種曖昧「 」距離? |
‌ |
零寬度,用於切開兩個字元 | 國中談戀愛都會被強制分「‌」手 |
國中談戀愛都會被強制分「‌」手 |
‍ |
零寬度,用於產生連字效果 | 但大家還是會偷牽「‍」小手 |
但大家還是會偷牽「‍」小手 |
我自己在編輯HTML時,累積出一些經驗,像是遇到首行縮排兩字或或排版不整齊的狀況,善用這些空格符號就可以快速解決問題,所以我覺得這也算是冷知識吧。  
和  
是我最常使用的空格符號。
四、結論與自我鼓勵
第一次參加鐵人賽,就迎來了意想不到的生活意外,今日是媽媽開刀住院的第一天,有些手忙腳亂,所以今日的文章稍微比較匆忙結束,晚一點或明天起床後會再找時間補齊內容,祝福大家與我自己能持續完賽並身體健康。