HTML是前端技术中基础的基础，虽然很简单，但是前端写的好坏区别在于是否充分理解了语义化。
语义化: 说的通俗点就是：明白每个标签的用途（在什么情况下使用此标签合理）比如，网页上的文章的标题就可以用标题标签，网页上的各个栏目的栏目名称也可以使用标题标签。文章中内容的段落就得放在段落标签中，在文章中有想强调的文本，就可以使用 em 标签表示强调等等。
语义化的好处：
1.更容易被搜索引擎收录。
2.更容易让屏幕阅读器读出网页内容。
以下为几个常见的语义化标签：
p 段落
hx 标题（x=1~6）
em 强调文本
srtong 更强烈的强调文本
q 短文本引用 引用的时候不需要加"",浏览器渲染后，会让被引用的短文本自动加上""
blockquote 长文本引用，浏览器渲染后，会让被引用的长文本自动加上缩进格式
<br />用于换行，相当于word文档中的回车
添加空格
<hr /> 换行
address 地址标签
code 引用一行代码
pre 引用大段代码
img 引用图片
<table summary="表格简介文本"> summary里面的值是不会再浏览器中显示出来的
<caption>2012年到2013年库存记录</caption> table的标题,显示在table正上方
a标签
<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>
a标签着重注意的是以下两个属性：
1.title属性，title属性的作用，鼠标滑过链接文字时会显示这个属性的文本内容。这个属性在实际网页开发中作用很大，主要方便搜索引擎了解链接地址的内容（语义化更友好）
2.target属性，当target="_blank"时，点击链接会在新的窗口打开链接。
关于a标签，大部分人都会觉得它的唯一作用是链接标签，但是它还有一个重要的作用是发送邮件，href属性里可以直接写上电子邮件，通过a标签直接链接到电子邮箱，例如：
<a href="mailto:yy@imooc.com?subject=观了不起的盖茨比有感&body=邮件内容">对此影评有何感想，发送邮件给我</a>
表单标签
<form method="传送方式" action="服务器文件">
值得注意的是以下2个属性：
1.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。
2.method ： 数据传送的方式（get/post）
文本输入框
<input type="text/password" name="名称" value="文本" />
<textarea rows="行数" cols="列数">文本</textarea>
text为文本输入框
password为密码输入框
输入框
单选复选框
<input type="radio/checkbox" value="值" name="名称" checked="checked"/>
1.type:
当 type="radio" 时，控件为单选框，同一组单选框，name一定要一致
当 type="checkbox" 时，控件为复选框
2.value：提交数据到服务器的值（后台程序PHP使用）
3.name：为控件命名，以备后台程序 ASP、PHP 使用
4.checked：当设置 checked="checked" 时，该选项被默认选中
下拉列表
<option value="看书">看书</option>
<option value="旅游">旅游</option>
<option value="运动">运动</option>
<option value="购物" selected="selected">购物</option>
</select>````
select标签中 加入这个属性 multiple="multiple"表示可以多选的下拉列表，进行多选时按下Ctrl键同时进行单击
option标签中 selected="selected表示选项默认被选中
####提交重置按钮
`<input type="submit/reset" value="提交">`
只有当type为submit时，才是提交按钮，reset为重置按钮
####form表单中的label标签
`<label for="控件id名称">`
注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。
label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该label标签相关连的表单控件上）。
值得注意的是：
span标签是没有任何语义的，他的作用仅仅是用来设置单独样式的
网友评论