Html基本语法

(Updated: )
Html
,

Html基础

基本结构

1
2
3
4
<html>
    <head>...</head>
    <body>...</body>
</html>
  1. <head>用于定义文档头部，它是所有头部元素的容器。头部元素有<title> <script> <style> <link> <mate>等标签。
  2. <body></body>之间是网页的主要内容，如 <h1> <p> <a> <img>等网页内容标签，这里的标签是将在浏览器中显示出来的。

基本语法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
1.	<!--注释-->
2.	<em>强调文本 斜体</em>
	<strong>强调文本 粗体</strong>
3.	<q>引用文本 显示效果为加上" "</q>
	<blockquote>长文本引用 显示效果为前后缩进</blockquote>
4.	<span>标记文本 被标记的文本可以用css和js进行操作</span>
5.	|html4.01 |xhtml1.0 | 作 用  |
	| <br>    | <br/>   | 换行符 |
	| <hr>    | <hr/>   | 水平线 |
	一般用xhtml1.0版的
6.	 ；为空格
7.	<address>地址信息 默认为斜体</address>
	<code>代码片段</code>
	<pre>代码块 即保留空格和换行符的格式化文本</pre>
8.	<ul>
    	<li>无序列表1</li>
    	<li>无序列表2</li>
    	...
	</ul>
9.	<ol>
    	<li>有序列表1</li>
    	<li>有序列表2</li>
    	...
	</ol>
10.	<div id="id以区分不同的块">独立的逻辑部分，会在末尾添加一个换行符</div>

11.	<table summary="表格简介文本">
    	<caption>表格标题文本</caption>
		<tbody>	<!--按结构一块块的显示，不在等整个表格加载完后显示-->
			<tr>	<!--表格的一行，所以有几对tr 表格就有几行-->
                <th>表头1</th>
                <th>表头2</th>
                <th>表头3</th>
            </tr>
            <tr>
                <td>数据1</td>
                <td>数据2</td>
                <td>数据3</td>
            </tr>
            <tr>
                <td>数据1</td>
                <td>数据2</td>
                <td>数据3</td>
            </tr>
    	</tbody>
	</table>
12. <a href="目标网址" target="_blank" title="鼠标滑过显示的文本">链接显示的文本</a>
	<!-- target="_blank"是在新窗口打开的作用 -->
13. <img src="图片地址" alt="下载失败时的替换文本" title="提示文本" >
14.	表单
        <form method="传送方式get post" action="服务器文件"></form>
        1.	<form>成对出现，以</form>结束
        2.	action ：输入的数据被传送到的地方
        3.	method ：数据传送的方式(get/post)
        4.	以下均出现在表单里
	选框：
        <input   type="radio/checkbox"   value="值"    name="名称"   checked="checked"/>
        1.	type: "radio"为单选框，"checkbox"为复选框
        2.	value：提交数据到服务器的值（后台程序使用）
        3.	name：为控件命名，以备后台程序 ASP、PHP 使用[同一组的单选按钮，name 取值一定要一致]
        4.	checked：当设置 checked="checked" 时，该选项被默认选中
	下拉列表：
	    <label>爱好:</label>
        <select multiple="multiple">
            <!-- multiple="multiple"为多选状态 -->
          <option value="向服务器提交的值1" selected="selected">显示的值1</option>
            <!-- selected="selected"为默认选中的选项 -->
          <option value="向服务器提交的值2">显示的值2</option>
        </select>
	提交按钮：
        <input type="submit" value="提交" />
        - type ：为submit时，才有提交作用
                 为reset时，为重置按钮
	label标签：
        <form>
          <label for="male">男</label>
          <input type="radio" name="gender" id="male" />
          <br />
          <label for="female">女</label>
          <input type="radio" name="gender" id="female" />
        </form>
        - 语法 ：<label for="控件id名称">选中这段文本时会选中id名相同的控件</label>