目录
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">已婚 <input
type="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>
5.查阅文档
