HTML标签分类
在HTML页面中，带有“< >”符号的元素被称为HTML标签，如上面提到的 <HTML>、<head>、<body>都是HTML标签。所谓标签就是放在“< >” 标签符中表示某个功能的编码命令，也称为HTML标签或 HTML元素（人类看不懂，但是，计算机认识）
1.按照结构分为双标签和单标签
（1）双标签
<标签名> 内容 </标签名>
该语法中“<标签名>”表示该标签的作用开始，一般称为“开始标签（start tag）”，“</标签名>” 表示该标签的作用结束，一般称为“结束标签（end tag）”。和开始标签相比，结束标签只是在前面加了一个关闭符“/”。
比如 <body>我是文字 </body>
（2）单标签
<标签名 />
单标签也称空标签，是指用一个标签符号即可完整地描述某个功能的标签。
比如 <br /> <br>
2.按照功能大致分为结构标签、排版标签、容器标签、图片标签、链接标签、文本格式化标签、列表标签、表单表格标签等
（1）排版标签:排版标签主要和css搭配使用，显示网页结构的标签，是网页布局最常用的标签:
1.注释标签：<!--注释-->
2.换行标签：<br/>
3.段落标签：<p>文本文字</p>
特点：段与段之间有行高
属性：align对齐方式 (left：左对齐 center：居中 right：右对齐)
4.水平线标签:<hr/>
属性:
width：水平线的长度(两种:第一种:像素表示；第二种，百分比表示)
size: 水平线的粗细 (像素表示，例如：10px)
color:水平线的颜色
align:水平线的对齐方式(left：左对齐 center：居中 right：右对齐)
（2）容器标签:在HTML开发中我们常常会使用一类标签作为容器放置一些内容，我们把这类标签称之为容器标签,主要有div和span
<div></div>:块级标签，独占一行，换行
<span></span>:行级标签，所有内容都在同一行
作用：<div></div>:主要是结合css页面分块布局
<span></span>:配合css修改网页的局部信息
（3）图片标签:img
<img/>单标签
属性:
src：图片地址： 相对路径 （同一个网站） 绝对路径 （不同网站）
width/height:宽度/高度(只设置一个，另一个会等比例进行缩放)
border:边框
align:对齐方式，代表图片与相邻的文本的相当位置（有三个属性值：top middle bottom）
alt:图片的文字说明(当图片加载失败,显示的描述文字)
title:当鼠标悬停时,显示描述文字
（4）链接标签:a标签定义超链接，用于从一个页面链接到另一个页
<a href="http://www.baidu.com">百度</a>
属性：
href:跳转页面的地址(记得添加协议https://,#代表空链接)
name:名称，配合id定位锚点(回到锚点: 顶部，底部，中间)，锚点的书写格式:#name的值
target:控制跳转方式,_self(自己) _blank(新页面，之前页面存在)
_search相等于给页面起一个名字，如果再次打开时，如果页面存在，则不再打开新的页面。可以是任意名字。
（5）文本格式化标签:针对文本进行各种格式化的标签
1.文字加粗:b/strong;
2.文字下划线:u/ins;
3.文字倾斜:i/em;
4.删除线:s/del
**strong与ins，em，del表示强调，语义明确更符合W3C标准**
（6）列表标签
1.无序列表:
无序列表标签： <ul></ul>
属性：type :三个值，分别为
circle(空心圆) ,disc(默认,实心圆),square(黑色方块)
列表项标签：<li></li>
2. 有序列表：
有序列表标签: <ol></ol>
属性：type：1、A、a、I、i（数字、字母、罗马数字）
列表项： <li></li>
3.自定义列表标签:
语法：
<dl>
<dt>列表标题</dt>
<dd>列表内容</dd>
<dd>列表内容</dd>
...
</dl>
（6）表单标签:用于收集不同类型的用户输入
1.form表单标签:
常用属性：
name属性：表单名称
action：提交地址，值为后台的地址，把表单的数据提交到该地址上处理
method:请求方式：get 和post
get:
1.地址栏,请求参数都在地址后拼接 path?name="张三"&password="123456"
2.不安全
3.效率高
4.get请求大小有限制，不同浏览器有不同，但是大约是2KB
使用情况：一般情况用于查询数据。
post：
1.地址栏：请求参数单独处理。
2.安全可靠
3.效率低
4.post请求大小理论上无限。
使用情况：一般用于插入修改等操作
enctype:表示是表单提交的类型
默认值：application/x-www-form-urlencoded 普通表单
multipart/form-data 多部分表单(一般用于文件上传)
2.input表单输入标签:
常用属性：
name属性：表单元素名字，只有name属性才能提交给服务器。
type属性: 规定 input 元素的类型
text 文本框 输入内容
password 密码框 密文
radio 表示是单选，name必须一致；value：提交给服务器的数据
checkbox 表示多选, name必须一致, 表示同一组中可以选多个( checked ="checked" 表示选中)
file ：表示上传控件(文字或图片)
3.select下拉框标签:
<select name="city"> <!--select标签添加该属性multiple="multiple"表示多选-->
<!--option表示下拉列表项-->
<option value="北京">北京</option>
<!--selected="selected"表示选中该项-->
<option value="上海" selected="selected">上海</option>
<option value="广州">广州</option>
<option value="杭州">杭州</option>
</select>
4. textarea文本域标签:
<textarea rows="3" cols="20"> <!--rows属性：限制行数,cols属性：限制一行容纳的字符数,使用 CSS 的 height 和 width 属性来限制也可以-->
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
本文同步发表在我的个人博客：https://www.lubaojun.com/
网友评论