人生苦短，我用python-- Day14之html
目录介绍
- html交互过程
- Doctype标签 ------->告诉浏览器使用什么样的html或xhtml规范来解析html文档
- meta标签 ------->提供有关页面的元信息，例：页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词
- 页面编码（告诉浏览器是什么编码）
- 刷新和跳转
- 关键词
- 描述
- IE兼容性
- title标签 -------->网页头部信息
- link标签 -------->连接文件，这里只说ioc图标是怎么使用link标签实现
- 各种符号
- p标签 -------->段落标签
- br标签 -------->换行符标签
- a标签 -------->连接标签
- 超链接
- 锚点
- H标签 -------->标题标签
- span标签 -------->行内标签，不带任何装饰，也是一个白板
- div标签 -------->白板标签
- 标签分类：块标签、行内标签
- 标签存在的意义
- 主动闭合标签和自闭和标签区别和用法
- GET和POST两种请求区别
- input标签 -------->输入框标签
- text标签 -------->普通输入框属性
- password标签 -------->密码输入框属性
- submit标签 -------->提交按钮输入框属性
- butto标签 -------->普通按钮输入框属性
- radio标签 -------->单选输入框属性属性
- checkbox标签 -------->复选框输入框属性
- file标签 -------->输入框标签上传文件输入框属性
- rest标签 -------->重置输入框属性
- textarea标签
- select标签
- a标签中锚点
- img标签
- table标签
- thead标签
- tbody标签
- tr标签
- td标签
- colspan标签
- rowspan标签
- css讲解
- 标签选择器
- class选择器
- id选择器
- 关联选择器
- 组合选择器
- 属性选择器
html交互过程
所有和web服务器交互的过程，其实都是一个客户端和服务器之间使用socket通讯的过程，服务器端发送的所有数据都是字符串，只有当浏览器把接收到的数据经过翻译以后，才会呈现出我们想要的效果。
Doctype标签
Doctype告诉浏览器使用什么样的html或xhtml规范来解析html文档
有和无的区别
- BackCompat：标准兼容模式未开启（或叫怪异模式[Quirks mode]、混杂模式）
- CSS1Compat：标准兼容模式已开启（或叫严格模式[Standards mode/Strict mode]）
这个属性会被浏览器识别并使用，但是如果你的页面没有DOCTYPE的声明，那么compatMode默认就是BackCompat,这也就是恶魔的开始 -- 浏览器按照自己的方式解析渲染页面，那么，在不同的浏览器就会显示不同的样式。如果你的页面添加了那么，那么就等同于开启了标准模式，那么浏览器就得老老实实的按照W3C的标准解析渲染页面，这样一来，你的页面在所有的浏览器里显示的就都是一个样子了。
有，用什么？
Doctype告诉浏览器使用什么样的html或xhtml规范来解析html文档, dtd文件则包含了标记、attributes 、properties、约束规则。
Meta(metadata information)
提供有关页面的元信息，例：页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词
1.页面编码（告诉浏览器是什么编码）
< meta http-equiv=“content-type” content=“text/html;charset=utf-8”>
2.刷新和跳转
<!--30秒刷新一次浏览器--> < meta http-equiv=“Refresh” Content=“30″>
<!--5秒刷新界面，刷新后跳转到autohome.com.cn网站--> < meta http-equiv=“Refresh” Content=”5; Url=http://www.autohome.com.cn“ />
3.关键词
<!--关键词是用来做网站收录，爬虫等用的--> < meta name="keywords" content="星际2,星际老男孩,专访,F91,小色,JOY" >
4.描述
<meta name="description" content="汽车之家为您提供最新汽车报价，汽车图片，汽车价格大全，最精彩的汽车新闻、行情、评测、导购内容，是提供信息最快最全的中国汽车网站。">
5.X-UA-Compatible
微软的IE6是通过XP、Win2003等操作系统发布出来，作为占统治地位的桌面操作系统，也使得IE占据了通知地位，许多的网站开发的时候，就按照IE6的标准去开发，而IE6自身的标准也是微软公司内部定义的。到了IE7出来的时候，采用了微软公司内部标准以及部分W3C的标准，这个时候许多网站升级到IE7的时候，就比较痛苦，很多代码必须调整后，才能够正常的运行。而到了微软的IE8这个版本，基本上把微软内部自己定义的标准抛弃了，而全面的支持W3C的标准，由于基于对标准彻底的变化了，使得原先在早期IE8版本上能够访问的网站，在IE8中无法正常的访问，会出现一些排版错乱、文字重叠，显示不全等各种兼容性错误。
与任何早期浏览器版本相比，Internet Explorer 8 对行业标准提供了更加紧密的支持。 因此，针对旧版本的浏览器设计的站点可能不会按预期显示。 为了帮助减轻任何问题，Internet Explorer 8 引入了文档兼容性的概念，从而允许您指定站点所支持的 Internet Explorer 版本。 文档兼容性在 Internet Explorer 8 中添加了新的模式；这些模式将告诉浏览器如何解释和呈现网站。 如果您的站点在 Internet Explorer 8 中无法正确显示，则可以更新该站点以支持最新的 Web 标准（首选方式），也可以强制 Internet Explorer 8 按照在旧版本的浏览器中查看站点的方式来显示内容。 通过使用 meta 元素将 X-UA-Compatible 标头添加到网页中，可以实现这一点。
当 Internet Explorer 8 遇到未包含 X-UA-Compatible 标头的网页时，它将使用 指令来确定如何显示该网页。 如果该指令丢失或未指定基于标准的文档类型，则 Internet Explorer 8 将以 IE5 模式（Quirks 模式）显示该网页。更多
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
title标签
网页头部的信息
<title>第一个html</title>
link标签
<!--这个ico就是网站标签上面的那个小图标--> < link rel="shortcut icon" href="image/favicon.ico">
各种符号
http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
空格符号为： 
大于号符号：>
小于号符号：<；
p标签
p表示段落，默认段落之间是有间隔的！
<p>你猜猜这里是p标签</p>
br标签
br 是换行标签，作用
<p>你猜猜这里是p标签</p> <br> <p>你猜猜这里是p标签</p>
a标签
1.超链接标签
<a href="http://www.baidu.com" target="_parent"> 老男孩官网 </a>
target属性，_black表示在新的页面打开
2.锚点
也是超链接，但是超链接的地址是页面本身页面的某个id
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <a href="#1"> 第一章 </a> <a href="#2"> 第二章 </a> <a href="#3"> 第三章 </a> <a href="#4"> 第三章 </a> <div id="1" style="height: 600px;"> 第一张 </div> <div id="2" style="height: 600px;"> 第二张 </div> <div id="3" style="height: 600px;"> 第三张 </div> <div id="4" style="height: 600px;"> 第四张 </div> </body> </html>
H标签
h标签总共有6个等级，分别为h1、h2、h3、h4、h5、h6
加大加粗
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>h1</h1> <h2>h2</h2> <h3>h3</h3> <h4>h4</h4> <h5>h5</h5> <h6>h6</h6> </body> </html>
span标签
span 是一个白板标签，里面有多少个字符，就占多大的像素。不会跨行，后面的东西在span标签后面继续追加
<span>span1</span>
<span>span2</span>
div标签
div标签也是一个白板标签，
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。
标签的分类
标签分为行内标签（也叫内联标签）、块标签
快标签：div，a，h，p等
行内标签：span标签，特殊符号等
标签存在的意义
后面我们学了css和js等，与div使用会使div变换成各种各样的效果
注意：标签之间是可以互相嵌套的
1
