html基本架構：超連結/列表/表格/表單
創建一個資料夾，把網頁會連到的相關連結放在裡面
首頁取名通常為index.html，以利伺服器找到首頁
1.絕對網址
連到外部網站，通常為絕對網址
<a href="http://google.com"></a>
2.相對網址
連到網站內部的其他網頁，這類網站通常會放置於和首頁相同資料夾
<a href="名稱.html"></a>
列表
1. 無序列表
<ul>
<li>carrot</li>
<li>cucumber</li>
<li>kale</li>
</ul>
<li>carrot</li>
<li>cucumber</li>
<li>kale</li>
</ul>
2. 有序列表
<ol>
<li>Yellow Potato</li>
<li>Red Potato</li>
<li>Blue Potato</li>
</ol>
3. 描述性列表
<dl>
<dt>carrot</dt>
<dd>a food that rabbits are fancy on</dd>
<dt>cucumber</dt>
<dd>a green stick</dd>
<dt>kale</dt>
<dd>a leafy like vegetable</dd>
</dl>
表格
<table>表格架構
<tr>表格欄(table row)
<th>Name</th>表格欄主標(table head)
<th>City</th>
<th>Age</th>
</tr>
<tr>
<td>Irene</td>表格欄內容(table data)
<td>Taipei</td>
<td>23</td>
</tr>
</table>
表單
<form>表格架構
<fieldset>表單邊界
<legend>Profile Info</legend>表格左
<lable>Name:</lable>
<input type="text"文字輸入欄位 placesholder="Fill in your name"><br>
<lable>Email:</lable>
<input type="email" 信箱輸入欄位 placesholder="Fill in your email"><br>
<lable>Password:</lable>
<input type="password" 密碼輸入欄位><br>
<br><br>
<lable>Gender:</lable><br>
<input type="radio" 選項按鈕 name="gender" 名字設定一樣，以判別該 類別為同一組，僅能選取一項>Male<br>
<input type="radio" name="gender">Female<br>
<br><br>
<lable>Type of Computer:</lable><br>
<input type="checkbox"核取方塊，可選取多個，例如：興趣>I have a laptop<br>
<input type="checkbox">I have a desktop<br>
<br><br>
<lable>Age:</lable>
<select>下拉式選單
<option>0-20</option>選單選項
<option>20-40</option>
<option>40+</option>
</select>
<br><br>
<lable>Biography:</lable><br>
<textarea 多欄文字輸入欄位 cols="30" rows="3"></textarea><br>
<br><br>
<input type="submit" 選單送出 value="submit my data"按鈕顯示名稱>
<input type="reset" 重新填寫 value="clear all">
</fieldset>
</form>
留言
張貼留言