[HTML]锚点、表格、列表、HTML5结构标记、表单

一、定义锚点

1 <a name="锚点名称">内容</a> //只适用于链接,使用name属性定义
2 
3 <ANY id="N锚点名称"></ANY> //任意标签使用id属性

 

二、链接锚点
1 <a href="#锚点名称">内容</a> //同一页面锚点
2 <a href="页面URL#锚点名称">内容</a>

 

三、表格
1.基本结构:
 1 <!doctype html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>table</title>
 6     </head>
 7     <body>
 8         <table align="center" border="1px" cellpadding="10px" cellspacing="10px" width="300px">
 9             <caption>成绩表</caption>
10             <tbody bgcolor="red" align="center">
11                 <tr>
12                     <th>序号</th>
13                     <th>姓名</th>
14                     <th>成绩</th>
15                 </tr>
16                 <tr>
17                     <th>1</th>
18                     <td>张三</td>
19                     <td>100</td>
20                 <tr>
21                 <tr>
22                     <th>2</th>
23                     <td>李四</td>
24                     <td>90</td>
25                 <tr>
26                 <tr>
27                     <th>3</th>
28                     <td>王五</td>
29                     <td>80</td>
30                 <tr>
31             </tbody>
32         </table>
33     </body>
34 </html>

 

 
2.跨行/列:
 1 <!doctype html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>table</title>
 6     </head>
 7     <body>
 8         <table border="1px" width="400px" height="400px" align="center">
 9         <tbody align="center">
10             <tr>
11                 <td colspan="2">a</td>
12                 <td rowspan="2">b</td>
13             </tr>
14             <tr>
15                 <td rowspan="2">c</td>
16                 <td>d</td>
17             </tr>
18             <tr>
19                 <td colspan="2">e</td>
20             </tr>
21         </tbody>
22         </table>
23     </body>
24 </html>

 

 
四、.列表
 1 <!doctype html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>table</title>
 6     </head>
 7     <body>
 8         <ol>
 9             <li>HTML文档片段
10                 <ul>
11                     <li>
12                         <a href="#">问题</a>
13                     </li>
14                     <li>
15                         <a href="#">方案</a>
16                     </li>
17                     <li>
18                         <a href="#">实现</a>
19                     </li>
20                     <li>
21                         <a href="#">拓展</a>
22                     </li>
23                 </ul>
24             </li>
25             <li>我的第一个HTML文档
26                 <ul>
27                     <li>问题</li>
28                     <li>方案</li>
29                     <li>实现</li>
30                 </ul>
31             </li>
32         </ol>
33     </body>
34 </html>

 

 
定义列表:
  1. <dl></dl>
  2. <dt></dt>
  3. <dd></dd>
 
五、HTML结构标记
  1. <header>:定义文档头部
  2. <nav>:导航
  3. <section>:定义文档中具体组成部分
  4. <article>:论坛帖子、新闻信息、博客条目
  5. <footer>:页脚
  6. <aside>:边栏
 
六、表单
1.语法:
  1. <form></form>
 
2.属性:
action:表单提交时发生的动作、提交地址,为url值,默认提交给本页
  1. action="xxx.php" //服务器端地址
method:表单提交数据时的方式
  1. a.get:向服务器要数据时使用(默认值)
  2. b.post:将数据交给服务器处理(有保密数据时)
enctype:编码类型
  1. a.application/x-www-form-urlencoded:默认值,允许将普通字符、特殊字符交给server,但不允许提交文件
  2. b.multipart/form-data:允许将文件提交给server
  3. c.text/plain:只允许提交普通字符。特殊字符和文件都无法提交
name:定义当前表单的名称
posted @ 2017-05-04 09:22  enginex  阅读(962)  评论(0编辑  收藏  举报