---
# System prepended metadata

title: T1-new-v5 code review
tags: [好想工作室]

---

# T1-new-v5 code review
###### tags: `好想工作室`
2022.03.18（Thu.）（Rex）

```
HTML：
1.<head>中的viewport與RWD有關
2.<link>的順序：自己的放最下面
3.<h1>包<a>：可連帶logo一起搜尋到
4.<h1><a><img alt="zerotype"></a></h1>
5.最底下莫名其妙的<script>處理一下
6.現在的命名方式會跟T3用boostrape有衝突
7.命名：.paragraph-content > .article-content
8.命名：.link > .social-media 或 .about-us會更貼切
CSS：
1.為什麼要用text-aign-last，而不是text-align？
2.<section>部份，為什麼需要設置vertical-align: top;？
3..image-content裡面再包一層<div>，讓<div>包住<img>
> <div>去改大小，不要直接動圖片的大小
4.<header>的border-bottom有顏色/<footer>的border-top有顏色
5.column為什麼是分3段2行？
6..article-container的font-size: 0沒作用 > 拿掉
7.引用google font（否則到其他人電腦可能無法顯示字體）
其他：
1.不用術語去解釋（再試試看 > 打出來
> 例如說：text-aign-last: justify是『左右均分』
2.footer a+a可以拿掉（讓他跟<nav>的作法一致會更好）
```

****

# <font color="#3881a1">HTML</font>
## 1. `<head>`中的viewport與RWD有關
## 2. `<link>`的順序：自己的放最下面
才不會被影響到
## 

****

# <font color="#3881a1">CSS</font>

## 1. 為什麼要用text-aign-last，而不是text-align？
text-align只能針對行內內容（文字）去控制對齊，對最後一行無作用，因此text-align-last就是用來針對最後一行做對齊的。

所以.header-container用text-align-last，而不使用text-align的原因，就是因為.header-container只有一行，可以作為第一行，但同時他也為最後一行，因此這裡必須使用text-align-last才有作用。

## 2. `<section>`部份，為什麼需要設置vertical-align: top;？
若不設置的話，vertical-align的預設為baseline，因此會貼齊baseline。

****

# <font color="#3881a1">OTHER</font>

## 1. 不用術語去解釋
header的部分：
先給外圍區塊一個寬度，然後讓這個外圍區塊對整個頁面置中，讓他對齊中心
裡面又分成了兩區塊
水平的部分，這兩個區塊讓他在這外圍區塊裡面去左右均分、貼齊兩側
垂直的部分，是對齊外圍區塊高度的中心
右邊的區塊裡面又再切了五個小區塊，這五個小區塊一樣的在裡面左右均分、貼齊兩側