1. 列表
列表總共有三種：無序列表、有序列表和定義列表。老師來給大家總結一下。
無序列表：無序列表中列表項和列表項之間不分先后順序。
<ul> <li>列表項1</li> <li>列表項2</li> <li>列表項3</li> <li>列表項4</li> </ul>
瀏覽器默認添加“·”作為先導符號。li不能單獨存在，必須包裹在ul里面，反過來說，ul里面只能有l(wèi)i。而li是一個容器級標簽，里面可以是任何標簽。
有序列表：
<ol> <li>列表項</li> <li>列表項</li> <li>列表項</li> </ol>
ol表示ordered list ，意思是有序列表。
定義列表：
<dl> <dt>定義標題</dt> <dd>定義描述</dd> <dt>定義標題</dt> <dd>定義描述</dd> <dt>定義標題</dt> <dd>定義描述</dd> </dl>
dl表示definition list 定義列表 。
dt表示definition title 定義標題。
dd表示definition description 定義表述詞兒。
dt、dd只能在dl里面；dl里面只能有dt、dd。
2. 表單
表單就是收集用戶信息的，就是讓用戶填寫的、選擇的。
<div> <h3>歡迎注冊本網(wǎng)站</h3> <form> 所有的表單內容，都要寫在form標簽里面 </form> </div>
div的語義是division“分割”，div標簽是最最重要的布局標簽，div中的所有元素是一個小區(qū)域。
form是英語表單的意思，form中間可以添加文本框、密碼框、單選按鈕、復選框、下拉列表、按鈕、文本域等內容。
文本框：
<input type="text" value="默認值" />
密碼框：
<input type="password"/>
單選按鈕：
<input type="radio" name="命名" checked="checked"/>男 <input type="radio" name="命名"/>女
radio是“收音機”的意思，input的type的值如果是radio就是單選按鈕。需要注意的是必須要有相同的name屬性，單選按鈕才能互斥。
復選框：
<input type="checkbox" name="aihao"/> 睡覺 <input type="checkbox" name="aihao"/> 吃飯
下拉列表：
<select> <option>吃飯</option> <option>睡覺</option> <option>打豆豆</option> </select>
文本域：
<textarea cols="20" rows="10"></textarea>
普通按鈕：
<input type="button" value="我是一個普通按鈕" />
提交按鈕：
<input type="submit" />
3. 綜合演練
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>表單實戰(zhàn)演練</title> </head> <body> <div> <h2>表單</h2> <form> <p>請選擇您的性別： <input type="radio" name="sex" id="nan" /> <label for="nan">男</label> <input type="radio" name="sex" id="nv" checked="checked" /> <label for="nv">女</label> </p> <p> 請選擇你的愛好： <input type="checkbox" name="aihao"/> 睡覺 <input type="checkbox" name="aihao"/> 吃飯 <input type="checkbox" name="aihao"/> 足球 <input type="checkbox" name="aihao"/> 籃球 <input type="checkbox" name="aihao"/> 乒乓球 <input type="checkbox" name="aihao"/> 打豆豆 </p> <p>請選擇您的家鄉(xiāng)： <select> <option>北京</option> <option>河北</option> <option>河南</option> <option>山東</option> <option>山西</option> <option>湖北</option> <option>安徽</option> </select> </p> <p> <input type="submit" /> <input type="reset" /> </p> <p>請輸入您的賬戶名： <input type="text" value="" /> </p> <p>請輸入您的密碼： <input type="password" /> </p> <p> <input type="button" value="登錄" /> <input type="reset" /> </p> <p>請輸入您的建議和要求：</p> <textarea cols="30" rows="10"></textarea> </form> </div> </body> </html>
效果圖：
