---
# System prepended metadata

title: 專題網頁新裝上市

---

# 專題網頁新裝上市
## HTML元素

![](https://i.imgur.com/uAeUMdd.png)

 <*head*>
網頁瀏覽器和搜索引擎（Goolge）等計算機機器人了解網站信息的部分。
很重要的部分。

 <*meta*>
指定關於文檔本身的各種信息，而不是文檔的內容的部分。

 <*title*>
描述網站名稱和每個頁面的標題的部分。

 <*script*>
寫javascript的部分。

 <*link*>
寫出與外部網頁的關係以及css/javascript文件的讀取目的地的部分。

![](https://i.imgur.com/Bo9nyFa.png)



 <*body*>
寫要在網站上顯示的文本或圖像的html tag的部分。

 <*nav*>
網站或網頁的主要導覽連結。

 <*header*>
裡面可以有標題、介紹文字或像網頁最上方的網頁標頭區塊中會有網站名稱、導覽連結、搜尋表單等內容。

 <*ul*>
表示項目的無序列表。

 <*li*>
描述個別的項目內容。

 <*a*>
設置鏈接的起點和終點的部分。

 <*main*>
tag規定文檔的主要內容。

 ![](https://i.imgur.com/DwoFI8i.png)

 <*h*>
標題的tag。

 <*p*>
*＜ｐ＞～＜/ｐ＞* 包圍的範圍顯示為段落的部分。
 
 ![](https://i.imgur.com/GFUrlG3.png)

 
 <*br*>
換行的部分。

 <*img*>
顯示圖像的部分。
 
 
 
 



 
## 修改的風格配色
本來的風格配色
![](https://i.imgur.com/K5JpLWr.png)

修改後的風格配色
![](https://i.imgur.com/L626lcy.png)

### 如何設計新的配色
![](https://i.imgur.com/7AQtcMn.png)
 把 #7acbe1（淺藍色） 改寫 red
![](https://i.imgur.com/ZEpVPEi.png)


![](https://i.imgur.com/tDYucOy.png)
 把 #7acbe1（淺藍色）改寫 black
![](https://i.imgur.com/mwi0bd8.png)



本來的風格配色
![](https://i.imgur.com/LFbFrYH.png)

修改後的風格配色
![](https://i.imgur.com/xbV0NzL.png)

### 如何設計新的配色
![](https://i.imgur.com/VdpDu4Y.png)
把 #009bc6（藍色）改寫 #008000（綠色）
![](https://i.imgur.com/b96H6dd.png)



本來的風格配色
![](https://i.imgur.com/DLrZue2.png)

修改後的風格配色
![](https://i.imgur.com/tKh8grZ.png)

### 如何設計新的配色
![](https://i.imgur.com/QBbEJb9.png)
把 #99cc65（淺綠色）改寫 #ffcc00（黃色）
![](https://i.imgur.com/YKIvZsA.png)



本來的風格配色
![](https://i.imgur.com/5WcJNMk.png)

修改後的風格配色
![](https://i.imgur.com/RMynNoI.png)

### 如何設計新的配色
![](https://i.imgur.com/EV98UNU.png)
把 #ffffff（白色）改寫 #ee0000（紅色）
![](https://i.imgur.com/xcEWPRn.png)


