這篇文章要教你的是，到底CSS語法可以加在哪裡，才不會讓網站爆炸呢？以及一些使用CSS語法的小工具們，讓你在學習CSS語法的過程中不孤單。

我想很多人都是程式語法的初學者，，因為擔心自己亂加CSS而導致網站整個壞掉，而不敢隨意接觸CSS語法這塊，總是靠外掛來替網站作微調。

我以前也跟你們一樣，在接觸到Wordpress建站後，才開始慢慢摸索CSS語法，後來就漸漸發覺到CSS的好處與方便性，不僅可省去使用無數個外掛，也減少網站被外掛速度拖累的問題。

---

1.CSS語法修改位置

1-1.外觀自訂

首先，進入控制台後，滑鼠移動到左側的外觀→接著點選自訂，進入網站外觀的自訂區域。

---

1-2.附加的CSS

接著點選左側最下方的附加的CSS，你會看到下圖右邊的畫面，下方紅色線條框選處就是你貼上CSS語法的位置。

每當你貼上一個有效的CSS語法，右邊的網站預覽畫面都會照著你的CSS語法作改變。如果你滿意CSS語法的效果，點擊右上角「發佈」就完成了。

如果你不喜歡CSS語法的效果，只要直接把語法刪除，效果就會消失，又恢復到你原本的網站樣式，是一個可以很安全使用語法的位置，不會把網站整個毀滅！可以盡情地嘗試CSS語法。

---

2.顏色色表

另外，大家在利用CSS更改樣式時，顏色的表達方式會是6個英文數字組成的色碼，這個色碼可以到 HTML Color Picker 來查詢。

使用方法也非常簡單，從左側色盤挑選好顏色的大方向後，右側會讓你選擇明暗度，中間則是顏色與黑白色文字的預覽圖，當你選好顏色後，下方#開頭的文字，就是你要使用的色碼，請連同前面的#字號一起複製到你的CSS語法中，就OK囉。

---

3.名稱定義

剛開始使用CSS語法時，要修改的樣式的名稱總是讓人很容易混淆，CSS Reference 整理表，你需要用到的CSS語法名稱都在這裡，雖然是英文，但是總好過什麼都沒有靠自己空想，以下提供我比較常用的項目：

• background-color：背景顏色
• font-family：使用字體
• font-size：字體大小
• font-weight：字體粗細
• color：顏色
• padding：外圍寬度
• border：邊框樣式

---

4.修改示範

如果你對於CSS語法有一點興趣，在「6個重點整理，用Contact Form 7製作完美的聯絡我們頁面」文章內，我使用了CSS語法來示範一些使用的教學，歡迎閱讀。

---

如果你對於這篇文章有任何疑問或者建議，都歡迎你在底下留言給我喔：）