目錄
1.表格標簽
2.列表標簽
3.表單標簽
4.綜合案例?
5.查閱文檔
1.表格標簽
<body><table align="center" border="1" cellpadding="0" cellspacing="0" width="500" height="100"><thead> <!-- 可以不用thead和tbody --><tr><th>排名</th><th>關鍵詞</th><th>趨勢</th><th>進入搜索</th><th>最近七日</th><th>相關鏈接</th></tr></thead><tbody><tr><td>1</td><td>鬼吹燈</td><td><img src="down.jpg"></td><td>456</td><td>123</td><td><a href="#">百科</a> <a href="#">圖片</a></td></tr></tbody></table>
</body>
<body><table align="center" border="1" cellspacing="0" width="500" height="250"><tr><td></td><td colspan="2"></td><!-- 合并第一行的2、3列,再把第一行第3列的格子刪掉 --><td></td></tr><tr><td></td><td></td><td></td><td></td></tr><tr><td rowspan="2"></td><!-- 合并第1列的三、四行,再把第1列第四行的格子刪掉 --><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr></table>
</body>
2.列表標簽
<body><h4>無序標簽</h4><ul><li>蘋果</li><li>香蕉</li><li>梨</li></ul><h4>有序標簽</h4><ol><li>蘋果</li><li>香蕉</li><li>梨</li></ol><h4>自定義列表</h4><dl><dt>名詞1</dt><dd>解釋1</dd><dd>解釋2</dd><dt>名詞2</dt><dd>解釋1</dd><dd>解釋2</dd></dl>
</body>
3.表單標簽
<body><form action=""><!-- test文本框,用戶可以輸入任何文字 -->用戶名:<input type="text" name="username" value="請輸入用戶名" maxlength="6"> <br><!-- password密碼框,用戶看不見輸入的密碼 -->密碼:<input type="password" name="pwd"> <br><!-- radio單選按鈕,若加上表單元素名字name(必須相同)實現單選 -->性別:男 <input type="radio" name="sex" value="男"> 女 <input type="radio" name="sex" value="女"> <br><!-- checkbox復選框,實現多選 --><!-- 單選按鈕和復選框可以設置checked屬性,實現打開頁面時默認選中 -->愛好:吃飯<input type="checkbox" name="hobby" value="吃飯" checked="checked"> 睡覺<input type="checkbox" name="hobby"value="睡覺"> 打豆豆<input type="checkbox" name="hobby" value="打豆豆"> <br><!-- value值可更改提交按鈕上顯示的文字,默認“提交” --><!-- 點擊了提交按鈕可以把表單域form里表單元素里面的值提交的后臺服務器 --><input type="submit" value="免費注冊"><!-- reset重置按鈕 --><input type="reset" value="重新填寫"><!-- 普通按鈕button 后期結合js 搭配使用 --><input type="button" value="獲取短信驗證碼"> <br><!-- 文件域:上傳文件使用的 -->上傳頭像:<input type="file"> <br><!-- label標簽,綁定一個表單元素 --><label for="num">QQ號碼:</label> <input type="text" id="num"></form>
</body>
<body><form action="">籍貫:<select><option>火星</option><option>月球</option><option selected="selected">地球</option></select></form>
</body>
<form action="">今日反饋:<textarea cols="50" rows="5">這個反饋留言由textarea做的</textarea></form>
4.綜合案例?
<body><h4>青春不常在,抓緊談戀愛</h4><table width="600"><form action=""><tr><td>性別</td><td><input type="radio" name="sex" id="nan"><label for="nan">男</label><input type="radio" name="sex" id="nv"> <label for="nv">女</label></td></tr><tr><td>生日</td><td><select><option>--請選擇年--</option><option>1996</option><option>1997</option><option>1998</option><option>1999</option><option>2000</option><option>2001</option></select><select><option>--請選擇月--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option><option>11</option><option>12</option></select><select><option>--請選擇日--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option></select></td></tr><tr><td>所在地區</td><td><input type="text" value="湖南長沙"></td></tr><tr><td>婚姻狀況</td><td><input type="radio" name="con" checked="checked"> 未婚<input type="radio" name="con">已婚 <inputtype="radio" name="con">離婚</td></tr><tr><td>學歷</td><td><input type="text" value="本科生"></td></tr><tr><td>喜歡的類型</td><td><input type="checkbox">嫵媚的<input type="checkbox">可愛的<input type="checkbox">小鮮肉<input type="checkbox">老臘肉<input type="checkbox">都喜歡</td></tr><tr><td>自我介紹</td><td><textarea>自我介紹</textarea></td></tr><tr><td></td><td><input type="submit" value="免費注冊"></td></tr><tr><td></td><td><input type="checkbox" checked="checked">我同意注冊條款和會員加入標準</td></tr><tr><td></td><td><a href="#" target="_blank">我是會員,立即登錄</a></td></tr><tr><td></td><td><h5>我承諾</h5><ul><li>年滿18歲、單身</li><li>抱著嚴肅的態度</li><li>真誠尋找另一半</li></ul></td></tr></form></table>
</body>