# h2第一題 Flex 大挑戰

心得：要如何不以瞎猜方式下指令 → **隨時查看主軸跟交錯軸方向**

## 第二題 觀察影片
#### Flexbox Live Demo 切版
* 先整理內容(Ex 色系<主色、輔助色>、字體[標題24px、副標20px、普通16px]...) → 找出共通部分
* (類)css reset:主色放在html標籤，a連結設定顏色，td
* LOGO部分 h1>a>img h1設定for SEO
* content 可在外框下df jcsb → 會自己空出中間的20px，不用再下mr20
* aside內的高度用line-hight來撐；標題(甜點類別)用h2
* 在aside li a 下 border，相疊的地方會變成2px → 可在 aside li 下 mb:-1
* 元素重疊的地方用 position:abslute 處理
#### 文字單行與多行處理辦法 - line-height 與 padding 的抉擇
* 文字行數與設計師確認
* 文字只有單行的狀態：line-hight 或 padding 都可以
* 文字會有多行的狀態：padding

## 第三題 Font Awesome
* 到官網下載後，以link引入
`<link href="/your-path-to-fontawesome/css/all.css" rel="stylesheet">`
* 引用方式
`<i class="fas fa-user"></i>`
* icon 的名字可到 Icons 看
* 可用 color 改顏色

###### tags: `CSS學習筆記`