HTML是什么？
基础知识
html就是要告诉浏览器我的某个东西是什么，没错，这就是它的主要功能。html的实质，他就是一种标签，一种人和浏览器交流的标签，我们只有告诉浏览器这是什么，他才能帮助我们显示.
HTML 不是一种编程语言，而是一种标记语言
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
HTML 文档包含了HTML 标签及文本内容
HTML文档也叫做 web 页面
那html或htm与其它如php、asp、aspx、jsp等后缀结尾的网页有什么区别呢？ 首先，html页面是静态的从头到尾没有程序的执行是纯的html语言，是不经过服务器处理就直接送出给浏览器呈现给浏览者。 而其他后缀的结尾的网页相对来说就是动态网页页面，动态页面是经过服务器对各自的程序翻译处理、数据库操作等处理然后才由浏览器把服务器处理完的数据程序给用户，而网页内容数据可以随后台数据改变而改变。
完整HTML包括html DOCTYPE声明、title标题、head、网页编码声明等内容
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>网页标题-www.divcss5.com</title> <meta name="keywords" content="关键字" /> <meta name="description" content="此网页描述" /> </head> <body> 网页正文内容-WWW.DIVCSS5.COM -DIVCSS5提供 </body> </html> 1、无论是动态还是静态页面都是以“<html>”开始，然后在网页最后以“</html>”结尾。 2、“<html>”后接着是“<head>”页头，其在<head></head>中的内容是在浏览器中内容无法显示的，这里是给服务器、浏览器、链接外部JS、a链接CSS样式等区域，而里面“<title></title>”中放置的是网页标题，可在浏览器最左上看见如图：3、接着“<meta name="keywords" content="关键字" /> <meta name="description" content="本页描述或关键字描述" /> ”这两个标签里的内容是给搜索引擎看的说明本页关键字及本张网页的主要内容等SEO可以用到。 4、接着就是正文“<body></body> ”也就是常说的body区 ，这里放置的内容就可以通过浏览器呈现给用户，其内容可以是table表格布局格式内容，也可以DIV布局的内容，也可以直接是文字。这里也是最主要区域，网页的内容呈现区。 5、最后是以“</html> ”结尾，也就是网页闭合。 |
|---|
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="utf-8">
- <title>网页标题-www.divcss5.com</title>
- <meta name="keywords" content="关键字" />
- <meta name="description" content="此网页描述" />
- </head>
- <body>
- 网页正文内容-WWW.DIVCSS5.COM -DIVCSS5提供
- </body>
- </html>
1、无论是动态还是静态页面都是以“<html>”开始，然后在网页最后以“</html>”结尾。 2、“<html>”后接着是“<head>”页头，其在<head></head>中的内容是在浏览器中内容无法显示的，这里是给服务器、浏览器、链接外部JS、a链接CSS样式等区域，而里面“<title></title>”中放置的是网页标题，可在浏览器最左上看见如图： 3、接着“<meta name="keywords" content="关键字" /> <meta name="description" content="本页描述或关键字描述" /> ”这两个标签里的内容是给搜索引擎看的说明本页关键字及本张网页的主要内容等SEO可以用到。 4、接着就是正文“<body></body> ”也就是常说的body区 ，这里放置的内容就可以通过浏览器呈现给用户，其内容可以是table表格布局格式内容，也可以DIV布局的内容，也可以直接是文字。这里也是最主要区域，网页的内容呈现区。 5、最后是以“</html> ”结尾，也就是网页闭合。
网页结构
网页显示中文
标签<meta/>
<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。
<meta> 标签位于文档的头部，不包含任何内容。<meta>标签的属性定义了与文档相关联的名称/值对。
- meta标签的参数：meta标签分两大部分：HTTP-EQUIV和NAME变量
HTTP-EQUIV类似于HTTP的头部协议，它回应给浏览器一些有用的信息，以帮助正确和精确 地显示网页内容。常用的HTTP-EQUIV类型有： 1.expires(期限) 说明：可以用于设定网页的到期时间。一旦网页过期，必须到服务器上重新调阅。 用法：<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb1997 08:21:57 GMT"> 注意：必须使用GMT的时间格式。 2.Pragma(cach模式) 说明：禁止浏览器从本地机的缓存中调阅页面内容。 用法：<META HTTP-EQUIV="Pragma"CONTENT="no-cache"> 注意：这样设定，访问者将无法脱机浏览。 3.Refresh(刷新) 说明：需要定时让网页自动链接到其它网页的话，就用这句了。 用法：<META HTTP-EQUIV="Refresh" CONTENT="5;URL= http://www.yahoo.com"> 注意：其中的5是指停留5秒钟后自动刷新到URL网址。 4.Set-Cookie(cookie设定) 说明：如果网页过期，那么存盘的cookie将被删除。 用法：<META HTTP-EQUIV="Set-Cookie"CONTENT="cookievalue=xxx; expires=Wednesday, 21-Oct-98 16:14:21 GMT; path=/"> 注意：必须使用GMT的时间格式。 5.Window-target(显示窗口的设定) 说明：强制页面在当前窗口以独立页面显示。 用法：<META HTTP-EQUIV="Window-target"CONTENT="_top"> 注意：用来防止别人在框架里调用你的页面。 5.Content-Type(显示字符集的设定) 说明：设定页面使用的字符集。(我们在前面字体设计中已经介绍过它的作用) 用法：<meta http-equiv="Content-Type"content="text/html; charset=gb2312">
- meta标签的NAME变量语法格式
<META NAME="xxx"CONTENT="xxxxxxxxxxxxxxxxxx"> 其中xxx主要有下面几种参数： 1.Keywords(关键字) 说明：keywords用来告诉搜索引擎你网页的关键字是什么。 举例：<META NAME ="keywords" CONTENT="life, universe,mankind, plants, relationships, the meaning of life, science"> 2.description(简介) 说明：description用来告诉搜索引擎你的网站主要内容。 举例：<META NAME="description" CONTENT="This page isabout the meaning of life, the universe, mankind and plants."> 3.robots(机器人向导) 说明：robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。 CONTENT的参数有all,none,index,noindex,follow,nofollow。默认是all。 举例：<META NAME="robots" CONTENT="none"> 4.author(作者) 说明：标注网页的作者 举例：<META name="AUTHOR"content="ajie,ajie@netease.com">
其中最重要的就是:Keywords和description的设定。
标签 link
link标签通常放置在一个网页的头部标签head标签内的用于链接外部css文件、链接收藏夹图标（favicon.ico），<link> 标签最常见的用途是链接外部样式表，外部资源。
link 标签的内容结构解释 href 值为外部资源地址这里是收藏夹图标地址 rel 定义当前文档与被链接文档之间的关系,这里是外部icon图标属性 type 规定被链接文档的 MIME 类,这里是值为image/x-icon
标签 script
script标签通常放置在一个网页的头部标签head标签内的用于链接外部JS文件外部资源标签，<script> 标签最常见的用途是链接外部js，外部资源。
<script type="text/javascript"src="js/index.js"></script>
链接外部JS时候script 标签的内容结构解释 src的值为外部资源地址，这里是js文件的地址,相当于link标签href链接外部css文件一样CSS引用 type规定被链接文档的 MIME 类,这里是值为text/javascript
HTML if 条件注释：
判断作用的注释以上通过html注释让不同版本IE浏览器读取不同内容，并让对应浏览器显示或执行。是正常的html代码。
<!--[if lt IE 9]>
<script type="text/javascript"src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
对于HTML5的标签，IE9之前的版本无法提供支持。目前的最佳解决方法是通过html5.js来帮助这些旧版本的IE浏览器创建HTML5元素节点。
标签DIV
<div> 标签定义文档中的division/section。
Div是Html标签之一，div具有分割内容作用，div与CSS样式可让网页实现各种样式效果。
在html中使用最多的布局标签为div，加上对网页设置css样式，所以通常我们就说div+css制作即使有div标签+css样式实现网页布局重构。
3）、Div本身没有什么特别之处，而div标签替代了以前table标签布局。 4）、他们通过对div标签对象设置不同样式实现我们要的美化效果。 5）、特性，通常一对未设置任何样式的div，独占一行。
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上，换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。
不必为每一个 <div> 都加上类或 id，虽然这样做也有一定的好处。
可以对同一个 <div> 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。
标签：alt
<img src="img_logo.gif"alt="W3School.com.cn" />
必需的 alt 属性规定图像的替代文本，如果该图像无法显示。
当用户无法查看图像时（可能由于网速太慢、错误的 src 属性、或者用户使用的是屏幕阅读器），alt 属性为图像提供了替代的文本。
标签 ul li, ol li
ul li无序列表布局与ol li有序列表布局语法与结构相同，不同是默认
无初始化CSS样式情况下, 一个是有序号列表（1、2、3、4 ；I、II、III这类有序序号），一个为没有序号的列表。无论是有序ol li列表还是无序的ul li列表，在日常时候都需要重新设置CSS样式使用布局。
标签 dl dt dd
<dl> <dt> <dd>是一组合标签，使用了dtdd最外层就必须使用dl包裹，此组合标签我们也又叫表格标签.
<dl><dt></dt><dd></dd></dl>为常用标题+列表型标签。如没有对dldt dd标签初始CSS样式，默认dd列表内容会一定缩进。
标签 p
常常我们在需要分段大换行时候，对内容前加<p>内容后加</p>即可实现文章换段落。
段落标签，每个段落之间有一定距离，类似于一个p换段标签等于使用两个br标签换行
腾讯云开发者
