基本语法
HTML文档由HTML元素定义。
<开始标签 属性=值>内容</结束标签>
基本格式
<!DOCTYPE html><!-- 开头固定的元素 -->
<!-- 注释，浏览器不执行 -->
<html>
<head><!--提供有关文档标题和标注信息-->
<meta charset="utf-8"><!--设置编码-->
<title>html文档标题</title><!--html标题-->
</head>
<body><!--内容部分-->
</body>
</html><!--html文档结束-->常见文本标签
HTML 文本格式化标签
<b> 粗体文本
<strong> 强调语气，也是加粗文本
<em> 着重文字，其实也是倾斜字体
<i> 斜体字
<small> 小号字
<sub> 下标字
<sup> 上标字
<ins> 下划线
<del> 删除字（文字的中间线）
<u> 下划线
HTML "计算机输出" 标签
<code> 定义计算机代码
<kbd> 定义键盘码
<samp> 定义计算机代码样本
<var> 定义变量
<pre> 定义预格式文本
HTML 引文, 引用, 及标签定义
<abbr> 定义缩写
<address> 定义地址
<bdo> 定义文字方向
<blockquote> 定义长的引用
<q> 定义短的引用语
<cite> 定义引用、引证
<dfn> 定义一个定义项目。
格式标签
列表
有序列表
type表示序号类型，reversed表示反序（没有表示正序）
可以嵌套<ol type="1" reversed> <li>aa</li> <li>bb</li> <li>cc</li> </ol>无序列表
<ul> <li>aa</li> <li>bb</li> <li>cc</li> </ul>
标题
<h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6>
段落
<p></p>
表格
border表示边框宽度
colspan='2' 列合并数 放在<td>元素中
rowspan='2' 行合并数 放在<td>元素中<table border="1"> <tr> <td>第1行第1列</td> <td>第1行第2列</td> </tr> <tr> <td>第2行第1列</td> <td>第2行第2列</td> </tr> </table>
表单和输入
表单
action 向何处发送表单
method 发送表单的方法
<form name="input" action="html_form_action.php" method="post"></form>
单行文本框
<input type="text" name="t1"><br><!--常规-->
<input type="text" name="t2" value="初始值"><br><!--带初始值的-->
<input type="text" name="t3" placeholder="提示"><br><!--带提示的-->
<input type="text" name="t4" maxlength="8"><br><!--最大输入长度=8-->
<input type="text" name="t1" size="50"><br><!--文本框长度为50-->
<input type="text" name="t1" value="只读值" readonly><br><!--只读-->
密码框
type="password"，其他属性同单行文本框
多行文本框
<Textarea name="ta1" rows="10" cols="20" >
</textarea>
数字
<input type="number" name="n1" min="-10" max="10" step="2" value="6">
滑动条range
同number
<input type="range" name="n1" min="-10" max="10" step="2" value="6">
复选框checkbox
<input type="checkbox" name="cc" value="c1">选项1
<input type="checkbox" name="cc" value="c2">选项2
单选框radio
必须name相同才能用
<input type="radio" name="sex" value="male">男
<input type="radio" name="sex" value="female">女
如果需要选择一个初值选择，需要用checked属性
<input type="radio" name="sex" value="male" checked>男
<input type="radio" name="sex" value="female">女
下拉菜单
<select name="cars">
<option value="volvo">Volvo</option>
<option value="fiat">Fiat</option>
</select>
如果需要预选一个，使用selected属性
<select name="cars">
<option value="volvo">Volvo</option>
<option value="fiat" selected>Fiat</option>
</select>
预先定义的输入控件datalist
<input type="text" list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
input获取指定格式
type属性email、tel、url，使用跟单行文本框相同。
获取时间
<input type="date" name="t1">
获取颜色
<input type="color" name="c1">
获取查询
<input type="search" name="c1">
隐藏的输入
<input type="hidden" name="h1">
图像输入
<input type="image" src="123.jpg" width="128" height="128">
文件上传
multiple允许上传多个文件
requied必须上传一个
<input type="file" name="file">
按钮
<input type="button" value="按钮" name="b1">
<input type="submit" value="提交" name="s1">
<button>按钮</button>
分区响应图
<form>
<img usemap="#map1" src="1234.jpg" alt="链接">
</form>
<map name="map1">
<area href="www.baidu.com" shape="rect" coords="1,1,20,20">
</map>shape：定义了相关区域的形状。
- default（ 默认值）：规定全部区域。
- rect：矩形区域。
- circle：圆形区域。
- poly：多边形区域。
cooreds：定义相关区域的坐标。（和 shape 属性搭配使用）
- 当 shape 属性为 rect 时，代表相关区域为 矩形，cooreds 属性值为 (x1,y1,x2,y2)，其中 x1、y1 为左上角的坐标，x2、y2 为右下角的坐标。
- 当 shape 属性为 circle 时，代表相关区域为 圆形，cooreds 属性值为 (x,y,radius)，其中 x、y 为圆形的中心坐标，radius为圆形的半径。
- 当 shape 属性为 poly 时，代表相关区域为 多边形，cooreds 属性值为 (x1,y1,x2,y2,x3,y3…xn,yn)，规定了多边形各个顶点的坐标，由于浏览器会自动闭合多边形，所以尾部坐标不必与第一个坐标相等。
链接
<a href="url" target="_blank">链接文本</a>
target：定义了在何处打开目标链接。
_blank：在新窗口打开。
_self：（默认）使得目标文档载入并显示在相同的框架或者窗口中作为源文档。
_parent：在父框架集中打开。
_top：在整个窗口中打开。
图片
<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">
alt图片打不开的时候的替换文本
6万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
