如果要开发设计一个网站，除了需要熟练后端工程师语言表达（如：php）外，还需要熟练HTML编码。那样，什么叫HTML呢？HTML是一种动态网页编译语言，它包含了众多标签，我们可以通过这个标签，把不一样的cnternet网络资源（如：文本、图片、短视频、声频、表格这些）融合在一个统一的word里，这就构成了我们可以看得到的网页页面。那样，HTML都有哪些常见的标签呢？
一、文档类型声明。
html5文档类型声明：
<!doctype html>
html4文档类型声明：
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
二、html主标签。
这个标签是html最外层的标签，所有其它的HTML标签都要放在这个标签的内部。
<html>
<head></head>
<body></body>
</html>
三、双标签和单标签。
在HTML标签中，有的标签是成双成对的，如：<html></html>（如下图）；而有的标签是单个的，如：<hr>横线标签。
四、head头部标签。
- head头顶部有以下几点常见标签：
- meta：主要是给予相关页面的元信息。
- link：用于界定文本文档与外部资源之间的关系，广泛使用的是调用CSS款式文件。
- title：页面关键词的标签。
- script：用于调用JS文件或JS编码。自然，script标签还可以在body行为主体中应用。
五、body主体标签。
1、块级标签。
块级标签的特性是：独自占有一行；标签的高与宽、边距可以修改；没有设置宽与高时，默认继承父标签。例如：
<div>div1</div>
<div>div2</div>
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
前端页面显示的效果如下图：
常用的块级标签有：div、h1、h2、h3、h4、h5、h6、hr、menu、ul、ol、li、dl、dt、dd、table、p、form 。
2、内联标签。
内联标签与块级标签不一样，它不可以独自一人占有一行，会与其他内联标签在同一个一样展现；内联标签的高与宽、上下面距是不可以改动的，因为里面的句子或图片有多高，它是多高。比如如下所示编码：
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<span>span1</span>
<span>span2</span>
CSS样式代码跟块级标签的例子是一样的，而显示的效果就不一样了，宽与高、上下边距没有效果。如下图：
常用的内联标签有：span、a、b、strong、i、em 。
3、内联块级标签。
内联块级标签，不仅有一些内联标签的特性，也有一些块级标签的特征：它不可以独自一人占有一行，但是能够改动它总宽和高度。比如下边这一段编码：
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<img src=\"w5.jpg\" >
<img src=\"w5.jpg\" >
CSS样式代码跟块级标签的那个例子仍然是一样的，图片的宽和高、上下边距修改成功，而2个图片不能独自占有一行，而是在同一行。如下图：
常见的内联块级标签有：img、input、textarea。
4、区域标签。
所说区域标签，便是主要是用于区划合理布局网页页面区域的。如：头顶部、行为主体具体内容、侧边栏、底端。那样区划的好处在于：让网页布局更为条理清晰。
常见的区域标签有：header（头顶部）、footer（底端）、nav（导航栏）、aside（侧边栏）、section（行为主体）、article（单独具体内容）。
5、表单标签。
这一表单标签大家是会经经常使用的，如：登录网站时、递交数据库的情况下。如下图的留言表单：
表单常见的标签有：form、input、select、option、textarea 。
以上就是关于大家开发网页页面时，会常用到的HTML标签。自然，HTML标签远不止这种，尤其是html5出来之后，增加了很多的新标签。可是，有一些标签在咱们开发中非常少用到，因此，这里也没做对应的详细介绍。
本文为原创文章，版权归三条八主机所有，欢迎分享本文，转载请保留出处！
你可能也喜欢
- ♥ 腾讯官方轻量网络服务器WordPress站点宝塔面板建立站点WordPress流程步骤SSL证书07/05
- ♥ 新手搭建建站：wordpress后台之友情链接(wordpress友情链接页面)05/23
- ♥ 网站搭建教程：WordPress使用WAMP本地服务器伪静态的实现(wordpress全站静态化)09/18
- ♥ 宝塔面板系列建站教程：WordPress 网站常规设置和固定链接修改(宝塔面板搭建wordpress网站)02/15
- ♥ 网站搭建教程：wordpress主题的导航菜单怎样设置？(WordPress导航主题)07/16
- ♥ 新手搭建建站：wordpress怎样修改网站标题和副标题？(wordpress首页修改)06/27
内容反馈