<!DOCTYPE html>
<html lang ="en"> ----网页的开始
<head> ----网页的头部，这些内容往往都是在浏览器不可见
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>1</title> ----网页的标题
</head> ----网页头部结束
<body> ----网页内容开始
</body> ----网页内容结束
</html> ----网页的结束1.HTML标签、 head标签、 body标签
整个网页是从<html>这里开始的，然后到</html>结束。
网页的头部从<head>这里开始，到</head>结束，头部定义一些特殊内容，往往在浏览器上十不可见的。
网页的内容是从<body>这里开始，到</body>结束，body标签里的内容就是展示在浏览器上的。
2.常用标签
<body>
<!--注释-->
<strong>粗体</strong>
<b>粗体</b>
<em>斜体</em>
<i>斜体</i>
<u>下划线</u>
<del>删除线</del>
</body><!-- -->标签里的内容就是注释的部分
以上标签都是双标签，两个尖括号之间的内容就是显示在浏览器的内容，strong和b标签会以粗体的方式显示内容，em 和 i 标签会以斜体的方式输出，u 和 del 标签也是这样的方式。
<body>
第一行<br> ----换行
第二行<br>
第三行
<hr width="800px" size="8"> ----水平分割线
</body>除了双标签还有单标签，双标签是成双成对的，单标签就是单个出现。
br标签用来换行，如果没有br标签，会以 “第一行第二行第三行” 的方式输出。
hr标签是水平分割线，可以设置width和size ，px代表像素。
<body>
<p align = "center">
第一个段落
</p>
<p>
第二个段落
</p>
<font color = "red">
字体标签
</font>
二的三次方 2<sup>3</sup><br>
求数列前n项的和 a<sub>1</sub>+a<sub>2</sub>+...+a<sub>n</sub>
<pre>
1
2
3
</pre>
<p>
1
2
3
</p>
<span style = "color:red; font-size:30px">
行内标签
</span>
</body>p标签是段落标签，两个相邻的p标签之间会空一行，相当于使用了br标签。align是p标签的属性，控制段落的位置，默认left 在网页左边，还有right和center。
font标签用来规定字体、字体大小、字体颜色，但HTML5不支持，一般用CSS。
sub和sup分别是下标和上标标签。
pre标签用来原样输出，相当于p标签中的1和2后面都跟了一个<br>。
span标签是修饰文本的标签，style是属性，改变文本的样式，一般在CSS中定义。
<body>
<h1>标题</h1>
<h2>标题</h2>
<h3>标题</h3>
<div>
块级标签
</div>
</body>hn是标题标签，n的取值只能是1-6，数字越大字体越小。
div是标准的块级标签，上面讲到的span是标准的行内标签。
行内标签：不能自动换行，除非这行内容铺满
块级标签：自动换行，独占一行 ，div hn p hr都是块级标签
3.表单标签
<body align="middle" bgcolor="#fedcbd">
<span style="font-size: 40px;">
用户注册
</span>
<form action="">
用户名：<input type="text"><br>
密 码：<input type="password" autofocus><br>
请选择您的性别：<input type="radio" name="s"checked>男 <input type="radio" name="s">女<br>
请选择您的爱好：<input type="checkbox">足球
<input type="checkbox">篮球
<input type="checkbox">LOL
<input type="checkbox">王者荣耀
<input type="checkbox">韩剧<br>
邮箱：<input type="email" value="请输入你的邮箱"><br>
用户头像：<input type="file"><br>
您的家庭住址是：<select name="" id="">
<option value="">西安</option>
<option value="">重庆</option>
<option value="">张家界</option>
<option value="">哈尔滨</option>
<option value="">北京</option>
</select><br>
您的收货地址：<select name="" id="" multiple>
<option value="">请选择您的收货地址</option>
<option value="">永川</option>
<option value="">合川</option>
<option value="">万中</option>
<option value="">渝中</option>
<option value="">巴南</option>
</select><br>
请留下您的建议或意见：<textarea name="" id="" cols="30" rows="10">您的建议或意见</textarea><br>
请您选择您喜欢的颜色：<input type="color">注册的时间：<input type="datetime-local"><br>
<input type="submit" value="注册">
<input type="reset">
</form>
</body>
form是表单标签，一般和input标签连用。
action属性用来跳转，跳转的路径分绝对路径和相对路径。
绝对路径：从盘符开始到文件为止
相对路径：源文件相对于目标文件的相对路径
input标签中的type有许多取值，text代表文本框、password代表密码框、submit代表提交按钮等等。 常见的属性有readonly只读不能修改、required不能空白提交等等。
select标签是下拉列表框，常和option标签连用，option标签是选项，selected属性在option标签中使用表示默认选中的选项，multiple属性在select标签中使用表示以列表的形式展示。
textarea标签用来显示文本域，cols属性代表多少列，rows属性代表多少行。
4.a标签
<body>
<a href="#1" >第一章</a><br>
<a href="#2" >第二章</a><br>
<a href="#3" >第三章</a><br>
<p>
<a href="" id="1">第一章</a><br>
农业政策性金融在世界各国的金融体系中都占有着极其重要的地位，它是随着商品货币关系和农业产业发展而出现的，是国家和政府以自身的信用为基础，严格根据政策划分界定，运用优惠的存贷利率和特殊的资金融通手段，直接或间接地扶持、保护农业产业和支持农村经济发展的特殊的金融活动。农业政策性金融的功能主要体现在以下的四个方面。
一是直接扶持。农业政策性金融是以国家农业相关政策为根据、以区域发展方针为基本导向，降低融资门槛，以较优惠的利率幅
</p>
<p>
<a href="" id="2">第二章</a><br>
农业政策性金融在世界各国的金融体系中都占有着极其重要的地位，它是随着商品货币关系和农业产业发展而出现的，是国家和政府以自身的信用为基础，严格根据政策划分界定，运用优惠的存贷利率和特殊的资金融通手段，直接或间接地扶持、保护农业产业和支持农村经济发展的特殊的金融活动。农业政策性金融的功能主要体现在以下的四个方面。
一是直接扶持。农业政策性金融是以国家农业相关政策为根据、以区域发展方针为基本导向，降低融资门槛，以较优惠的利率幅
</p>
<p>
<a href="" id="3">第三章</a><br>
农业政策性金融在世界各国的金融体系中都占有着极其重要的地位，它是随着商品货币关系和农业产业发展而出现的，是国家和政府以自身的信用为基础，严格根据政策划分界定，运用优惠的存贷利率和特殊的资金融通手段，直接或间接地扶持、保护农业产业和支持农村经济发展的特殊的金融活动。农业政策性金融的功能主要体现在以下的四个方面。
一是直接扶持。农业政策性金融是以国家农业相关政策为根据、以区域发展方针为基本导向，降低融资门槛，以较优惠的利率幅
</p>
</body>a标签表示超文本链接标签，用来进行页面的跳转。
href属性放的是要跳转的路径，用#+id进行链接。
5.img标签
src ----- 图片的路径 （绝对路径和相对路径）
alt ----- 代替图片文本的内容（图片的路径错误或者因为浏览器的原因打不开这个图，用一个词或者 一段话代替描述这个图片）
width ----- 宽度 height ---- 高度 单位都是px %
border ------ 边框 默认值是0
align ---- 位置 （图片和文字的位置） 取值：top ----- 上对齐 middle ----- 居中对齐 bottom ------ 下对齐（默认对齐） right ----- 右对齐 left ------ 左对齐
6.表格标签
<table border="1" width="400px" height="400px" bgcolor="pink" background="图片
1.png" cellpadding="30" cellspacing="20">
<thead>表头</thead>
<tbody> ----- 表格的主干
<tr> ---- 行
<td>第一行第一列</td> ----列
<td>第一行第二列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
</tr>
<tr>
<td>
<table border="1" width="200px" height="300px" bgcolor="green">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</td>
</tr>
</tbody>
<tfoot>表尾</tfoot>
</table>
table标签 包含了thead tbody tfoot tr td标签，border 属性用来设置表格边框，width 属性设置表格宽度， height属性设置表格高度，bgcolor属性设置背景颜色， background 属性设置背景图片。
表格里面可以嵌套另一个表格.
cellpadding ---- 表示的是表格边距（表示单元格内元素距离单元格边框的距离）
cellspacing------ 表示的是表格的间距（表示的是单元格和单元格之间的距离）
cellpadding 、cellspacing都有一个默认值 2px
<table border="1" cellspacing="0" width="300px" height="300px">
<tr>
<td rowspan="2"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
单元格合并行,rowspan="n" ,n是一个整数，表示在单元格垂直方向去跨行（合并行）
colspan = "n" , n是一个整数，表示在单元格水平方向去跨列（合并列）
7.列表标签
有序列表ol
<ol type="1" start="7" reversed>
<li>前端</li>
<li>前端</li>
<li>前端</li>
<li>前端</li>
</ol>type 属性表示设置序号的种类 ，默认值是数值1，还有A、a、Ⅰ、i。
start属性表示序号开始的位置
reversed属性表示反序（降序）
无序列表ul
<ul type="disc">
<li>前端</li>
<li>前端</li>
<li>前端</li>
<li>前端</li>
<li>前端</li>
</ul>type属性表示 无序列表的样式， disc（默认值 实心圆）circle(空心圆) square(实心方块)
数据列表dl
<dl>
<dt>这是数据列表的标题</dt>
<dd>这是内容1</dd>
<dd>这是内容2</dd>
<dd>这是内容3</dd>
<dd>这是内容4</dd>
<dd>这是内容5</dd>
</dl>
330
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
