表格元素
<table border="1"> <tr> <!-- rows --> <td>序列</td> <td>姓名</td> <td>年龄</td> <td>婚否</td> </tr> <tr> <td>001</td> <td>杨念</td> <td>60</td> <td>未婚</td> </tr> <tr> <td>002</td> <td>吴志辉</td> <td>18</td> <td rowspan="2">已婚</td> <!-- 跨行 --> </tr> <tr> <td>003</td> <td>AII</td> <td>20</td> <!-- <td>已婚</td> --> </tr> <tr> <td>004</td> <td>陈曼</td> <td colspan="2">80/已婚</td> <!-- 跨列 --> <!-- <td>未婚</td> --> </tr>
</table>
表单元素
<form action="#" method="post"> <!-- action 提交到哪个页面--> 账号:<input type="text" name="user" value="abc" /><br/> 密码:<input type="password" name="password" /><br/> 确认密码:<input type="password" style="width: 125px" /><br/> 邮箱:<input type="email" /> <br/> <!--email是H5属性值 --> 性别: <input name="gender" value="male" type="radio" />男 <input name="gender" value="female" type="radio" />女 <input checked name="gender" value="baomi" type="radio" />保密 <!-- 给value用于区分在request的get请求中的参数值,默认on/off -->
<input checked type="radio" name="hobby" value="basketball"/>打篮球 <input type="radio" name="hobby" value="reading"/>读书 <input type="radio" name="hobby" value="movie"/>看电影 <input type="radio" name="hobby" value="swimming"/>游泳 <input type="radio" name="hobby" value="studying"/>只爱学习 <br/><br/><br/> 其他爱好:<input checked name="surfing" type="checkbox"/>上网 <input name="money" type="checkbox"/>理财 <input name=breaking"" type="checkbox"/>Breaking(街舞) <input checked name="coding" type="checkbox"/>Coding <br/><br/> <!-- 提交后为GET方式(?后面拼接参数)发送到服务器 --> 生日: <select size="5"><!--size下拉框显示选择行数 --> <!--Emmet插件快速生成多级HTML--> <option value="1991">1991</option> <option value="1992">1992</option> <option value="1993">1993</option> <option selected value="1994">1994</option> <option value="1995">1995</option> </select>
个人说明: <textarea name="" id="" rows="10" cols="30"></textarea><br/> 按钮<input type="button" value="This is Button" /><br/> 重置按钮<input type="reset" value="重置" /><br/> 隐藏域:<input type="hidden" value="This is hidden"/><br/> <!-- hidden不是给用户看的,在页面中没有任何效果,可以用来验证表单是否跨域攻击CSRF --> <input type="submit" value="注册" /> <br/> </form>
网页转义特殊服务号示例(pre标签)
<pre> <!-- 转义,还可以保留换行 --> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="Keywords" content="关键字" /> <meta name="description" content="描述 80字以内" /> <title>title</title> <link href="#" rel="stylesheet" /> </head> </pre>