整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
TML
上一篇中，我们介绍了HTML语言的头部元素head，其包括多种信息，例如标题、样式表定义和脚本等。由此，我们可以确定标题信息包含在头部信息之中。HTML页面的标题一般是用来说明页面的用途，它显示在浏览器的标题栏中。标题标记以<title>开始，以</title>结束。
语法：
<title>······</titke>
说明：
在<title>和</title>之间的就是文档的标题内容，它能帮助用户更好的阅读页面。页面只有一个标题，且包含在头部元素<head>和</head>之间。
举例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>标题标记title</title>
<link rel="stylesheet" href="">
</head>
<body>
</body>
</html>
如下图所示：
代码
浏览器打开效果
作网页时，经常需要设置网页的基本信息，如网页的标题、作者等。为此，HTML提供了一系列设置网页信息的标签，这些标签通常都写在
<head>标签内，也被称为HTML.文档头部相关标签。下面将介绍常用的HTML文档头部标签中的<title>和<meta>标签。
(1)<title>标签
<title>标签用于设置HTML页面的标题，也就是为网页取一个名称。在网页结构中，<title>标签必须位于<head>标签内。一个HTML.文档只能含有一个<title>标签，<title></title>标签之间的内容将显示在浏览器窗口的标题栏中。例如，将某个页面标题设置为“轻松学习HTML.5”，示例代码如下：
<title>轻松学习HIML.5</title>上述代码对应的页面效果如下图：
(2)<meta>标签
<meta>标签用于定义页面的元信息(元信息不会显示在最终的页面效果中)，可重复出现在标签中。在HTML中,<meta>标签是一个单标签，本身不包含任何内容，仅表示网页的相关信息。通过标签的属性，可以定义页面的相关参数。
例如，为搜索引擎提供网页的关键字、作者姓名、内容描述，以及定义网页的刷新时间等。下面介绍<meta/>标签常用的几组设置，具体如下。
<meta name-”名称”content-”值”>：在<meta>标签中使用 name 属性和 content 属性可以为搜索引擎提供信息。其中，name属性提供搜索内容名称，content属性提供对应的搜索内容值，这些属性的具体应用如下。
设置网页关键字，如某图像网站的关键字设置，示例代码如下：
<meta name=“keywoxds”content=“千图网，免费素材下载，千图网免费素材图库，矢量图，矢量图库，图像素材，网页素材，
免费素材，PS素材，网站素材，设计模板，设计素材，网页模板免费下载，千图，素材中国，素材，免费设计，图像”/>在上述示例代码中，nare属性的属性值为"keywonds”，该属性值用于定义搜索内容名称为网页关键字;content 属性的属性值用于定义关键字的具体内容，多个关键字内容之间可以用“，”分隔。
设置网页描述，如某图像网站的描述信息设置，示例代码如下：
<meta name=”description”content=”专注免费设计素材下裁的网站！提供矢量图素材，矢量青景图像，矢量图库，还有
psd素材，PS素材，设计模板，设计素材，PPT素材，以及网页素材，网站素材，网页图标免费下载”/>在上述示例代码中，name属性的属性值为“deseription”，该属性值用于定义搜索内容名称为网页描述;comtent 属性的属性值用于定义描述的具体内容。网页描述的文字不必过多，能够描述清晰即可。
设置网页作者，如可以为网站增加作者信息，示例代码如下：
<meta name-"author" content="网络部"/>在上述示例代码中，name属性的属性值为”author”，该属性值用于定义搜索内容名称为网页作者;content属性的属性值用于定义具体的作者信息。
<meta http-equiv=”名称”content=”值”>在<meta/>标签中，http-equiv 属性和content 属性可以设置服务器发送给浏览器的HTTP头部信息，为浏览器显示该页面提供相关的参数标准。其中，http-equiv属性提供参数类型，content属性提供对应的参数值，这些属性的具体应用如下。设置字符集，如某图像官网字符集的设置，示例代码如下：
<meta http-equiva"Content-Type" content="text/html; charset=gbk"/>在上述示例代码中，hitp-epuiv属性的属性值为“Content-Type”.content属性的属性值为“test/html”和“charset=gbk”，两个属性值之间用“：”隔开。其中，“text/html”用于说明当前文档类型为HIML“charset=gbk”用于说明文档字符集为GBK(中文编码)。
目前最常用的国际化字符集编码格式是UTF-8，常用的中文字符集编码格式主要是GBK和GB2312。当用户使用的字符集编码格式与当前浏览器不匹配时，网页内容就会出现乱码。新版本的HTML.5简化了字符集的写法，示例代码如下：
<meta charset="utf-g">设置页面自动刷新与跳转，如定义某个页面10秒后跳转至百度首页，示例代码如下：
<meta http-equiv""refresh" content="10; url- httpa://sww.baidu.com/"/>在上述示例代码中，http-equiv属性的属性值为“refresh”，content属性的属性值为数值和URL。两个属性值之间用“：”隔开，分别用于指定跳转时间和目标页面的URL。跳转时间默认以秒为单位。
果想开发一个网站，除了要精通后端开发语言（如：php）外，还要精通HTML代码。那么，什么是HTML呢？HTML是一种超文本标记语言，它包含有众多的标签，我们可以通过这些标签，把不同的internet资源（如：文字、图片、视频、音频、表单等等）整合在一个统一的文档中，这就形成了我们可以看得见的网页。那么，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>
<head></head>
<body></body>
</html>
在HTML标签中，有的标签是成双成对的，如：<html></html>（如下图）；而有的标签是单个的，如：<hr>横线标签。
head头部有以下几种常用标签：
meta：主要提供有关页面的元信息。
link：用来定义文档与外部资源的关系，最常用的是调用CSS样式文件。
title：页面标题的标签。
script：用来调用JS文件或JS代码。当然，script标签也可以在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" alt="">
<img src="w5.jpg" alt="">
CSS样式代码跟块级标签的那个例子仍然是一样的，图片的宽和高、上下边距修改成功，而2个图片不能独自占有一行，而是在同一行。如下图：
常用的内联块级标签有：img、input、textarea。
4、区域标签。
所谓区域标签，就是主要用来划分布局页面区域的。如：头部、主体内容、侧边栏、底部。这样划分的好处是：让页面布局更加清晰明了。
常用的区域标签有：header（头部）、footer（底部）、nav（导航）、aside（侧边栏）、section（主体）、article（独立内容）。
5、表单标签。
这个表单标签我们也是会经常用到的，如：登录网站的时候、提交数据的时候。如下图的评论表单：
?表单常用的标签有：form、input、select、option、textarea 。
以上就是我们开发网页时，会常用到的HTML标签。当然，HTML标签远不止这些，尤其是html5出来后，新增了许多的新标签。但是，有些标签在我们开发中很少用到，所以，这里就没有做相应的介绍。
*请认真填写需求信息，我们会在24小时内与您取得联系。
