2021-05-06

# 文字編輯器調教：空白字元、行距

- 強迫導向程式設計師 在意文件與程式碼裡…
* 的每個字元，包含空白字元。
+ 必須是空白字元 ([ASCII 碼](https://en.cppreference.com/w/cpp/language/ascii) =32) 的地方，就不能混雜 tab 或是 全形空白。
+ 文字編輯器 務必要確實地顯示，好讓人看了安心。
* 文字的行距。
+ 過窄的行距令關注每個細節的職人分心；
+ 適當的行距才能閱讀地快又舒服。
- 本文記載各個編輯器如何調教到上述兩點要求，或是視情況有其他補充。
* 多半靠本身提供的選項設定
* 網站服務 的行距部份，則可透過類似的 擴充套件 來修改 CSS 樣式，
+ 如 Google Chrome 的 [Stylebot](https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha)
+ 或 Firefox 的 [Stylus](https://addons.mozilla.org/zh-TW/firefox/addon/styl-us/)

## [Sublime Text](https://www.sublimetext.com/)

從功能表 Preferences > Settings 開啟設定文件，增加以下項目。

**空白字元**

"draw_white_space": "all",

**行距**

"line_padding_top":    4,
"line_padding_bottom": 4,

**顯示編碼** 預設不顯示文件編碼，也令 (在意每個位元組的) 工程師蠻焦慮的。

"show_encoding": true,

## [Visual Studio Code](https://code.visualstudio.com/)

從功能表 File > Preferences > Settings 開啟設定頁面，調整以下項目。

- Editor: **Render Whitespace**
all
- Editor: **Line Height**
2
- Markdown › Preview: **Line Height**
2

## [Visual Studio](https://visualstudio.microsoft.com/) (2019)

**空白字元** 從功能表 Edit > Advanced > View White Space 切換

**行距**

1. 需要安裝 [Line Press](https://marketplace.visualstudio.com/items?itemName=OmarRwemi.LinePress) 擴充套件
2. 從功能表 Tools > Options... 開啟設定頁面
3. 左側點選 Line Press 項目，於右側設定 Line Spacing (Line Height) 為 50% of Line。

## [HackMD](https://hackmd.io/)

**空白字元** 還不知道

**行距**

.CodeMirror, #doc {
  font-size: 14px;
  line-height: 2;
}

{%hackmd @yipo/style %}