表格(Tables)
<table border="1"> <tr> <th>表格标题</th> <th>表格标题</th> </tr> <tr> <td>表格数据</td> <td>表格数据</td> </tr> </table>
<table border="5px" align="center"> <caption>课程表</caption> <tr> <th>项目</th> </tr> <tr> <td>星期</td> <td>星期一</td> <td>星期二</td> <td>星期三</td> <td>星期四</td> <td>星期五</td> <td>星期六</td> <td>星期天</td> </tr> <tr> <td rowspan="4">上午</td> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> <td rowspan="4">休息</td> </tr> <tr> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> </tr> <tr> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> </tr> <tr> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> </tr> <tr> <td rowspan='2'>下午</td> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> </tr> <tr> <td><a href="5.html">语文</a></td> <td><a href="5.html">数学</a></td> <td><a href="5.html">英文</a></td> <td><a href="5.html">化学</a></td> <td><a href="5.html">历史</a></td> <td><a href="5.html">生物</a></td> </tr> </table>
框架(Iframe)
<iframe src="demo_iframe.htm"></iframe>
表单(Forms)
<form action="demo_form.php" method="post/get"> <input type="text" name="email" size="40" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit" value="Send"> <input type="reset"> <input type="hidden"> <select> <option>苹果</option> <option selected="selected">香蕉</option> <option>樱桃</option> </select> <textarea name="comment" rows="60" cols="20"></textarea> </form>
<form action="" method="post"> 用户名:<input type="text"><br> 密码:<input type="password"><br> 性别:<input type="radio">男<input type="radio">女<br> 兴趣:<input type="checkbox">恋情<input type="checkbox">朗秋<input type="checkbox">贫穷<br> 选择文件:<input type="file"><br> 图片:<input type="image" src="https//"> <input type="reset"><br> <input type="submit"><br> <input type="button" value="自定义"><br> <input type="button"> <label for="username">用户名:</label><input id="username" type="text"><br> <label>密码:<input type="password"></label><br> </form> <!--select kongj--> <form action="" method="post"> 你的出生地? <select size="4" multiple="multiple"> <option value="beijing" selected="selected">1</option> <option value="hebei">2</option> <option value="hennan">3</option> <option value="shanhai">4</option> <option value="shandong">5</option> </select><br> <br> 你的居住地是? <select size="2"> <option value="beijing">1</option> <option value="hebei">2</option> <option value="hennan">3</option> <option value="shanhai">4</option> <option value="shandong">5</option> </select> 你去过的地方? <select multiple="multiple"> <option value="beijing">1</option> <option value="hebei">2</option> <option value="hennan">3</option> <option value="shanhai">4</option> <option value="shandong">5</option> </select> 你吃过的菜在哪里? <select size="7" multiple="multiple"> <optgroup label="11233"> <option value="beijing">1</option> <option value="hebei">2</option> <option value="hennan">3</option> </optgroup> <optgroup label="333333"> <option value="beijing">1</option> <option value="hebei">2</option> <option value="hennan">3</option> <option value="shanhai">4</option> <option value="shandong">5</option> </optgroup> </select> <button type="submit">提交</button><br> <button type="reset">重置</button><br> <textarea cols="50" row="5"></textarea><br> <textarea cols="60" rows="6" readonly="readonly">这个文本只读的领域</textarea> <hr> <input type="color " name="color" id="" value="#ff0000"><br> <input type="submit" id="name"> <hr> <input type="time" name="time" id= value=""><br> <input type="submit" id=" " name=""> <br> <input type="datetime-local" name="date" id=" " value=" "><br> <input type="submit" this.id="" name=""> <br> <input type="month" name="month" this.id="" value="" min="2021-02" max="2030-04"> <input type="submit" this.id="" name=""> <br> <input type="week" name="week" this.id="" value="" min="2021-w01" max="2030-w12"> <input type="submit" this.id="" name=""> <br> <input type="number" name="number" this.id="" value="" min="0" max="100" step="10"> <input type="submit" this.id="" name=""> <br> <input type="range" name="range" this.id="" value="" min="0" max="100" step="10"> <input type="submit" this.id="" name=""> <br> </form>
实体(Entities)
< 等同于 <
> 等同于 >
© 等同于 ©
22 HTML5 语义元素
HTML5 添加了很多语义元素如下所示:
<!--表格属性记忆--> <table border="5" cellpadding="20" cellspacing="3" width="500px" align="center" bgcolor="#7fff00"> <tr> <th>表格</th> <th colspan="5" bgcolor="#1e90ff">表格属性</th> </tr> <tr bgcolor="#ff69b4" valign="top"> <td>11</td> <td colspan="3">12</td> <td>15</td> </tr> <tr bgcolor="#8a2be2"> <td>21</td> <td>22</td> <td rowspan="3">23</td> <td>24</td> <td>25</td> </tr> <tr bgcolor="#1e90ff"> <td>31</td> <td>32</td> <td>33</td> <td>34</td> <td>35</td> </tr> <tr bgcolor="#8b008b"> <td align="center">131</td> <td>132</td> <td>133</td> <td>134</td> <td>135</td> </tr> <tr> <td>231</td> <td>232</td> <td>233</td> <td>234</td> <td>235</td> </tr> </table> <p> ====================================input 属性</p> <form> 1<input type="text" value="11111"><br> 2<input type="color" value="2222"><br> 3<input type="submit" value="33"><br> 4<input type="checkbox" value="444"><br> 5<input type="date" value="5555"><br> 6<input type="email" value="666"><br> 7<input type="hidden" value="777"><br> 8<input type="month" value="888"><br> 9<input type="number" value="999"><br> 10<input type="time" value="1000"><br> 11<input type="week" value="123"><br> 12<input type="url"><br> 14<input type="datetime-local"><br> 15<input type="file"><br> 16<input type="range"><br> 17<input type="file"><br> 18<input type="image"> <form action="#" method="get">留言:<br> <textarea cols="70" rows="10"> huafu </textarea> <input type="submit" value="tijiao"> </form> <form action="#" method="post">留言2:<br> <textarea cols="70" rows="10"> huafu </textarea> <input type="submit" value="tijiao"> </form> 空格 <; > & ¥ © ® ° ± ×;÷4 ²5³ </font> </form> <p> ========================padding border margin </p> </html>