HTML
簡易個人介紹網站
先來看看今日目標
我們需要些什麼
一張代表自己的頭像
一段自我介紹
一些簡介
一個好看的背景
body {
/* 背景圖片 */
background-image: url( ' 圖片網址 ' );
/* 背景顏色 */
background-color: 顏色名稱或色碼 ;
/**
repeat 預設重覆方式，背景圖片依 x 軸與 y 軸重覆呈現。
repeat-x 背景圖片沿 x 軸重覆呈現。
repeat-y 背景圖片沿 y 軸重覆呈現。
no-repeat 背景圖片不重覆出現，也就是只出現一次。
**/
background-repeat: 方向與重覆參數;
/**
scroll 預設值，背景圖片會隨著滑鼠滾動而上下移動。
fixed 背景圖片固定不動，滑鼠上下滾動僅會移動網頁主體。
**/
background-attachment: 顯示參數;
/**
水平方向 left - 靠左對齊、center - 置中對齊、right - 靠右對齊
垂直方向 top - 靠上對齊、center - 置中對齊、bottom - 靠下對齊
**/
background-position: 背景圖片水平位置參數 背景圖片垂直位置參數 ;
}背景的CSS
表格
<table border="1">
<tr>
<td>這裡是第一行的第一個欄位</td>
<td>這裡是第一行的第二個欄位</td>
</tr>
<tr>
<td>這裡是第二行的第一個欄位</td>
<td>這裡是第二行的第二個欄位</td>
</tr>
</table>| 這裡是第一行的第一個欄位 | 這裡是第一行的第二個欄位 |
|---|---|
| 這裡是第二行的第一個欄位 | 這裡是第二行的第二個欄位 |
表格寬度
<table border="1" style='width: 70%;'>
<tr>
<td style='width: 30%;'>這裡是第一行的第一個欄位</td>
<td style='width: 70%;'>這裡是第一行的第二個欄位</td>
</tr>
<tr>
<td>這裡是第二行的第一個欄位</td>
<td>這裡是第二行的第二個欄位</td>
</tr>
</table>width: '寬度'
<img src='圖片連結'><style>
img {
border-radius: 50%;
}
</style>
<img src='圖片連結'>標題
內文
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6><p>...</p>FreeCodeCamp
FreeCodeCamp Rank
w3cschool
MDN
高中生解題系統
LeetCode
HackerRank
