1. Emmet abbreviation：
Codepen中有各種迅速撰寫的方法，其中一個是Emmet，例如以下文字：
.XXX
#XXX
XXX
(li>a>i)*3
Dis
這幾個文字輸入後，按下tab有各種變化：
.XXX ： Html中，按下tab產生class name為XXX的DIV區塊標籤
#XXX ： Html中，按下tab產生id name為XXX的DIV區塊標籤
XXX ： Html中，按下tab產生名為XXX的區塊標籤
(li>a>i)*3： Html中，按下tab產生3行<li><a href=””><i></i></a> </li>複數標籤
Dis ： CSS中，按下tab產生display: inline;
更多說明參考：https://docs.emmet.io/abbreviations/
2. 標籤命名規則：
助教對於標籤命名，習慣會多加上 方向性、功能說明，例如
Button-row(按鈕-方向)
Button-cta(按鈕-功能)
Btn-cta(按鈕的縮寫-功能)
Btn-default(按鈕-功能)
3. CTA：Call-to-Action：
吸引注意力、或引導動作的設計。
善用CTA（Call-to-Action） 抓住電商潛在客戶的心
https://transbiz.com.tw/call-to-action-optimization/
4. 關於ul lili標籤：
a. 一系列的list建議使用ul li的標籤做處理，其中一個原因：Google搜尋爬蟲會找這個標籤，讓搜尋最佳化。
b. List-sytle: none
取消瀏覽器預設的"每一條之前的記號"。
PS： 除了記號外，padding、margin也會有預設值。
5. 關於Icon圖示：
a. Font awesome — 免費icon：
b. icon的圖片大小：
icon其實是使用字體製成的，所以大小是由font-size操作。
6. 關於a link 網頁連結標籤：
a. Attributes：
b. a link 網頁連結標籤小bug：
A tag有個小小問題，連結只有一半可以點擊，因為A標籤預設的display是inline：
7. 回家作業：
