HTML是啥什么 初学者必备HTML基础知识？

来源：蜘蛛抓取(WebSpider) 时间：2023-06-17 13:36 标签： HTML是啥
浏览器是安装在电脑里面的一个软件， 能够将网页内容呈现给用户查看，并让用户与网页交互的一种软件。 就好比QQ一样都是安装在电脑里面的一个软件， 只不过功能不同而已常见主流的浏览器如下图：
浏览器市场份额-国内统计
浏览器市场份额-国外统计
不同的浏览器 有 不同的浏览器内核，浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容，从而导致了浏览器的兼容性问题出现浏览器
内核
IE
Trident
谷歌
WebKit / Blink
火狐
Gecko
Safarri
WebKit
欧朋
Presto
服务器也是电脑，只不过是比我们的电脑 配置更高 的电脑，并且 24小时 不断电，不关机 的计算机
服务器是 专门用于存储数据 的电脑，访问者可以 访问服务器 获得 服务器上存储的资源
服务器 一旦关机，访问者就 无法访问，也无法访问服务器中存储的内容
浏览器请求数据的原理也就是我们是如何通过浏览器查看网页上的内容的？打开 IE 缓存文件夹，我的文件夹地址如下C:\Users\Jonathan_Lee\AppData\Local\Microsoft\Windows\Temporary Internet Files
Jonathan_Lee 为个人电脑的用户名名称，打开之后清空该文件夹的内容然后在用 IE 打开网页，发现结果如下发现文件夹下多了很多文件（.html、.css、.js、.png 等）仔细观察，不难发现其实这些文件都是被访问在网页上的内容结论访问网页其实是有 真实的、物理文件进行传输的
网页 不是一个文件，而是 一堆文件 组成的
我们之所以平常感觉第二次访问比第一次访问快的原因就是，第一次访问时已经将所有文件 缓存 到了本地
按下回车时浏览器根据输入的URL地址发送 请求报文
服务器接收到请求报文，会对 请求报文 进行处理
服务器将处理完的结果通过 响应报文 返回给浏览器
浏览器 解析服务器返回的结果，将结果显示出来
请求过程验证利用chrome浏览器打开一个网页
打开开发人员工具
打开 Network 查看请求报文和响应报文
请求报文一个HTTP请求报文由请求行（request line）、请求头部（header）、空行和请求数据4个部分响应报文一个HTTP响应报文由响应行、响应头、响应体组成我们在浏览器的地址栏中输入的地址其实就是URLURL格式127.0.0.1/index.html（浏览器会自动补全http和:80）
http://127.0.0.1/index.html（浏览器会自动补全:80）
http://127.0.0.1:80/index.html（完整格式）
协议类型://ip地址:端口号/资源路径/资源名称
URL拆分网络协议类型 http://
服务器IP地址 127.0.0.1
服务器端口号 80
资源路径 网页在服务器上的路径
资源名称 index.html
URL拆分后每一部分的作用服务器IP地址 和 服务器端口号 它们两的作用告诉浏览器要去什么地方才能找到对应的服务器，也就是告诉浏览器服务器的详细地址
服务器IP地址相当于现实生活中的地址；例如：湖南省永州市祁阳县
服务器端口号相当于现实生活中的门牌号码；例如：9栋909室
那么如果将地址和门牌号码结合在一起，就是我的详细地址
资源名称它的作用告诉服务器我需要获取哪一个文件
资源名称需要访问的文件名称
补充URL全称 Uniform Resource Locator（统一资源定位符)，互联网上的每一个资源都有一个唯一的URL地址
由于IP地址全都是数字，没有任何的含义，比较难以记忆。所以在访问网页时最常见的不是IP地址而是 “域名”（一串有含义的字母 OR 数字）
好比：http://www.baidu.com AND http://111.13.100.92:80/
HTTP是 Hypertext Transfer Protocol 的缩写, 超文本传输协议什么是协议在现实生活中有很多的协议，例如租房协议 / 买卖协议 / 离婚协议
无论是什么协议他们都是一个共同点，就是用来规范 / 约束某一类事物
沟通问题沟通最常见的问题就是语言不通，例如中国人和美国人沟通，一个人说中文，一个人说英文，如果两个人都不懂中文或者英文，那么就会出现沟通问题
如果要想解决沟通文件，是不是需要先拟定规定，两个人都说中文，或者两个人都说英文，或者请一个既懂中文又懂英文的翻译
HTTP协议是用来规范/约束哪一类事物浏览器访问网页其实就是去服务器请求数据，所以浏览器需要和服务器沟通，所以也会存在沟通问题
HTTP协议就相当于我们让两个人都说中文或者都说英文一样，就是提前规范两个人之间如何沟通，也就是规范 / 约束浏览器和服务器之间如何沟通
在Windows系统中如何查看文件的扩展名默认情况下Windows系统是不显示文件的扩展名的，但是作为一个开发者而言，查看文件的扩展名是我们的必备技能
win10：随便打开一个文件夹 -> 点击查看 -> 将文件扩展名的选项勾选上
电脑上的一个文件是可以 “同时” 被多个软件打开的，不同的软件打开可能会有不同的效果例如：同一个 index.html 文件可以被多个浏览器和记事本一起打开
例如：.html 文件通过浏览器打开不可以编辑，通过记事本打开可以编辑
什么是纯文本文件我们 Windows 电脑上有一款默认安装好的软件叫做记事本这款软件就是专门用来打开纯文本文件的，所以只要 能够被记事本打开，并且能够正常显示 的文件都是 纯文本文件
.html 的文件可以被记事本打开， 并且能够正常显示 所以 .html 文件是一个纯文本文件
背景知识HTMLHTML全称叫做超文本标记语言，是一种用于创建网页的标准标记语言，描述的是一个网站的结构语义随着线索的呈现。网页浏览器可以读取HTML文件，并将其渲染成可视化网页。它允许嵌入图像与对象，并且可以用于创建交互式表单，它被用来结构化信息——例如标题、段落和列表等等，也可用来在一定程度上描述文档的外观和语义。HTML常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面。嵌入JavaScript会影响HTML网页的行为，嵌入CSS可以改变网页的外观与布局。HTML5HTML5不仅仅是HTML规范的最新版本，它还是一系列用来制作现代富Web内容的相关技术的总称。HTML5核心规范定义用以标记内容的元素，并明确其含义。CSS可用于控制标记过程的内容呈现在用户面前的外貌。JavaScript则可以用来操纵HTML文档的内容以及响应用户的操作，此外要想使用HTML5新增元素的一些为编程目的的设计的特性也需要用到JavaScript。HTML5新标准引入了原生多媒体的支持，支持在浏览器中直接播放视频和音频文件（也就是说不借助于插件）；还添加了canvas元素，这个元素是对插件现象的另一种反应，它提供了一个通用的绘图平面，开发人员可以用它完成一些通常用Adobe Flash来完成的任务；还引入了语义Web，就是一些用来分开元素的含义和内容呈现方式的特性和规则。发展时间线1980年由物理学家 蒂姆·伯纳斯-李 在一项工程承包期间，为了使研究人员可以共享文档，创建原型系统 ENQUIRE1989年伯纳斯 提出了一个基于互联网的超文本系统1990年 伯纳斯 规定了HTML并写出浏览器和服务器软件1990年 伯纳斯 与 罗伯特·卡里奥 联合为项目申请资助，但未被GERN正式批准，发展受阻1991年 伯纳斯 公开提及 HTML1995年 由 IETF 发布 HTML2.0规范1997年 由 w3c 发布 HTML3.2规范（IETF于1996年关闭了HTML工作组）1998年 由 w3c 发布 HTML4.0规范1999年 由 w3c 发布HTML4.01规范2000年 HTML4.0.1严格版称为 IOS/IEC 国际标准2014年 由 w3c 发布HTML5规范历史事件 JavaScript的出场首先JavaScript语言的出现，标志着内嵌在Web浏览器种的客户端脚本程序控制功能的发端。原本是一种静态内容载体的HTML因此变得有点丰富起来。JavaScript并非HTML规范核心的组成部分，然而Web浏览器、HTML和JavaScript之间的关系是如此紧密，以至于根本无法将它们分开讨论。 浏览器战争的结束浏览器市场有过激烈的竞争，主要角逐者是微软和网景，它们都把在自己的浏览器中添加一些独有的特性当做竞争手段。这样做的结果是Web开发人员要么只使用那些所有浏览器都有的特性，要么煞费苦心地想些变通办法来使用各款浏览器中勉强相当地那些特性，这是一种煎熬。浏览器战争最终以网景倒台及微软受到惩处结束，为基于标准地网络浏览奠定了基础。HTML规范有了改进，遵从这个规范成了准则。现在的浏览器需要遵守标准的程度来竞争。这是一次天翻地覆的转折，开发人员和用户均收益于此。 插件称雄插件是Web世界的“益虫”，它们可以提供一些单用HTML很难实现的高级特性和丰富内容。Adobe公司的Flash就是这样一个典型。 语义HTML浏览器开发商看插件不顺眼，因为它把控制权转移到了插件开发商手中，HTML5的一大改进就是着力于让浏览器直接处理那些原来要使用Flash的富内容。HTML标准的早期版本不太关心将内容的意义与其呈现方式分开。现在人们越来越致力于分开HTML元素的意义与内容在浏览器中的呈现方式了。 现况不是每款浏览器都支持所有的特性，使用Modernizr（http://www.modernizr.com）之内的JavaScript库检查特性是可行的。也可以参考When Can I Use？网站（http://caniuse.com），上面提供了浏览器的支持情况和采用率方面的详细信息，并且勤于修订。更多信息最权威的参考网站：w3c（http://w3c.org）更具亲和力的参考网站：Mozilla开发者网络（http://developer.mozilla.org）HTML代码验证：https://validator.w3.org/基本用法元素我喜欢苹果和橘子。一个HTML元素分为三部分，其中有两部分称为标签（tag）：开始标签和结束标签，夹在两个标签之间的是元素的内容，本例中为单词 apples。元素是一种用来向浏览器说明文档内容的工具，其效果体现在内容之上。不同的元素有不同的确切含义。例如code元素代表的是计算机代码片段。元素名不区分大小写，、甚至都会被浏览器视为code元素的开始标签，不过建议全部使用小写。有些HTML元素会对呈现形式产生影响，现在的观点是应该用HTML元素说明文档内容的结构和含义，用CSS控制内容呈现给用户的形式，例如code元素通常使用等宽字体，不过可以用CSS改变其默认样式。元素的开始和结束标签之间并非一定要有内容，没有内容的元素称为空元素：我喜欢苹果和橘子。空元素还可以更简洁地只用一个标签表示：我喜欢苹果和橘子。有些元素只能使用一个标签表示，这类元素称为虚元素，hr就是这样一个元素，它是一种组织性元素，用来表示内容中段落级别的终止。虚元素有两种表示法，第一种只使用开始标签，如：
浏览器知道hr是虚元素，所以不会等待其结束标签出现。第二种表示法在此基础上加了一个斜杠符号，其形式与空元素一致：
你也可以把元素放到其它元素之中——这被称作嵌套，包含另一个元素的元素是包含元素的父元素。一个元素可以拥有多个子元素，但只能有一个父元素。body元素和code元素都是html元素的后代元素。具有同一个父元素的几个元素互为兄弟元素：

我喜欢苹果和橘子

属性全局属性和专有属性元素可以用属性（attribute）进行配置，属性具有名称和值两部分，有一些全局属性可用于所有HTML元素，还有用来提供其特有配置信息的专有属性。使用双引号界定属性值，不过也可以使用单引号，如果属性值本身含有引号，那么两种引号都要用到。常见的全局属性有：class属性：用来将元素分类，这样做通常是为了能够找出文档中的某一类元素或为某一类元素应用CSS样式draggable属性：表示元素是否可以拖放hidden属性：表示是否隐藏元素id属性：元素的唯一标识符，可以通过id属性给元素应用CSS样式、或者在js程序中用来选择元素、或者用来做文档内导航等lang属性：说明元素内容使用的语言style属性：用来直接给元素定义CSS样式title属性：提供元素的额外提示信息，把鼠标悬停在元素上面后会有提示信息显示出来一个元素可以应用多个属性，这些属性间以一个或几个空格分隔即可。这些属性的顺序是随意的，全局属性和元素专有属性可随意交错。 更多的全局属性参考：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes#全局属性列表布尔属性有些属性属于布尔属性，这种属性不需要设定一个值，只需将属性名添加到元素中即可，比如：，为布尔属性指定一个空字符串（""）或属性名称字符串作为其值也有同样的效果：、自定义属性用户可自定义属性，这种属性必须以data-开头，比如：，这种属性的恰当名称是作者自定义属性，有时也称扩展属性。 HTML4的规范是当遇到不认识的属性时应当忽略基本框架首先要创建一个HTML文档，最简单的方法是创建一个文本文件，并将其文件扩展名设置成为这类文件规定的.html。这个文件可以直接从磁盘载入浏览器，也可以从Web服务器载入。用于处理HTML文档的各种软件有一个共同的名称叫做用户代理（user agent）。浏览器是最流行的用户代理，但不是唯一的一种。要记住：你的HTML文档有可能会给别的一些软件处理。一个HTML文档的基本框架如下： Document 以前的浏览器可以处理HTML和XHTML文档（XHTML是HTML和XML序列化形式，即以符合XML规范的方式来表达文档的内容以及HTML元素和属性，以便XML解析程序处理。），为了让浏览器知道你的文档格式是一个HTML4.01的文档，且可以自动检测错误，需要在文档最前面加上一段代码：后来到了 HTML5 之后，XHTML 已经过时了，为了向后兼容，还是保留了这种写法，但是改成了这种格式：在不严格的情况下可以把这段代码是可以省略掉的。head 元素包含着文档的元数据，在 HTML 中，元数据向浏览器提供了有关文档内容和标记的信息，此外还可以包含脚本和对外部资源（比如 CSS 样式表）的引用。body 元素是浏览器页面中可以直接看到的主体内容。头部文档标题title 元素的作用是设置文档的标题或名称，每个 HTML 文档都应该有且只有一个 title 元素，其开始标签和结束标签之间的文字在用户眼里应有实际意义。基准URLbase 元素可用来设置一个基准URL，让HTML文档中的相对链接在此基础上进行解析。相对链接省略了URL中的协议、主机和端口部分，需要根据别的URL（要么是base元素中指定的URL，要么是用以加载当前文档的URL）得出其完整形式。元数据meta元素可以用来定义文档的各种元数据，局部属性有：name、content、charset 和 http-equiv。该元素有 3个用途： 指定名/值元素对name属性表示元数据的类型，而content属性用来提供值。如：html 有5个预定义类型：application nameauthordescriptiongeneratorkeywords：现在的搜索引擎对keywords元数据的重视成都远不如从前，这是因为它可以被滥用来制造页面内容和相关性的假象 还有一些扩展类型如 robots：告诉搜索引擎该如何对待该文档，如： 会告诉浏览器不要索引，content 取值还可以是 noarchive 表示不要将本页存档或缓存、nofllow 表示不要顺着本页中的链接继续搜索下去。 声明字符编码 UTF-8编码编码能以最少的字节数表示所有Unicode字符，所以用得非常普遍。 模拟HTTP标头字段http-equiv属性的用途是指定所有模拟的标头字段名称，字段值则由content属性指定，该属性由3个值可用： refresh： 如 每隔5秒钟就从服务器重新载入当前页面 default-style： 指定页面优先使用的样式表，对应的content属性值应与同一个文档中某个style元素或link元素的title属性值相同 content-type： 如 另一种用来声明HTML页面所用字符编码的方法指定外部资源link 元素可用来在html文档和外部资源之间建立联系，该元素有 6 个属性，其中最重要的属性就是 rel、type 和href 属性，rel说明文档与所关联资源的关系类型，，type 属性指定所关联资源的 MIME 类型，如 text/css、image/x-icon，href 属性指定元素指向的资源的 URL。rel 属性有 3 个比较常用的取值：prefetch：预先获取资源，如： stylesheet：表示载入外部样式表，如： shortcut：为页面定义网站标志，如： 如果网站标志文件位于 /favicon.ico （即 web 服务器的根目录），那就不必用到link元素。大多数浏览器在载入页面时都会自动请求这个文件，就算没有 link 元素也是如此。也可以自定义图标和大小： 定义CSS样式style 元素可用来定义 HTML 文档内嵌的 CSS 样式（ link元素则是用来导入外部样式表中的样式 ）。该元素可以出现在HTML文档中的各个部分，一个文档可包含多个style元素，因此不必把所有样式定义都塞进 head 部分。有 3 个局部属性：type：指定样式类型。可以用来将定义的样式类型告诉浏览器，但是浏览器支持的样式机制只有CSS一种，所以这个属性的值总是text/cssscope：指定样式作用范围。该属性是一个布尔属性，如果存在，则表示其中定义的样式只作用于该元素的父元素及所有兄弟元素，如果不用scope属性的话，在HTML文档中任何地方用style元素定义的样式都将作用于整个文档。media：指定样式适用的媒体。表示文档在什么情况下应该适用该元素中定义的样式，可以使用的设备值有：screen、print、tty等，还有一些其他特性，如：width、height、min-width、min-height等。比如： 还可以让style元素的对象更加具体： 脚本元素与脚本相关的元素有两个，第一个是script，用于定义脚本并控制其执行过程，第二个是noscript，用于规定在浏览器不支持脚本或禁用了脚本的情况下的处理办法： script元素script元素可以用来在页面中加入脚本，可以直接写脚本，也可以引用外部文件中的脚本。最常用的脚本类型是JavaScript，不过浏览器也的确支持一些别的脚本语言。 该元素可以放在head元素内也可以放在body元素内。该元素有4种常见用法： 定义文档内嵌脚本将JavaSciprt语句内嵌在HTML页面中：html ... ... 载入外部脚本库 如： 用defer属性推迟脚本的执行 默认情况下，浏览器一遇到script元素就会暂停处理HTML文档，转而载入脚本文件并执行其中的脚本，在脚本执行完毕之后浏览器才会继续解析HTML，defer属性告诉浏览器要等页面载入和解析完毕之后才能执行脚本： 注意该属性只能用于外部脚本，不能用于内部脚本。 用async属性异步执行脚本 用async属性之后，浏览器将在继续解析HTML文档种的其他元素的同时异步加载和执行脚本，如果运用得当，这可以大大提高整体加载性能。这类脚本一般不需要与HTML文档种的元素互相作用，比如收集网站访问者的统计数据以供分析。 noscript元素noscript元素可以用来向禁用了JavaScript或浏览器不支持JavaScript的用户显示一些内容：html

JavaScript is required

You cannot use this page without JavaScript

还有一种选择是在浏览器不支持JavaScript时将其引至另一个URL。这需要在noscript元素种加入一个meta元素：html 注释 举例 浏览器还支持一些其它的协议，比如https和ftp，如果想引用一个电子邮箱地址，那么可以使用mailto协议，如 mailto:admin@example.com电子邮件链接中还可以加上一些细节：cc、bcc、主题、主体等，如：指向内部的超链接（锚文本）超链接还可以指向同一个文档中的不同区域，只需要给目标区域的元素设置ID属性，然后设置a元素的href属性的值为#格式就可以：跳转到苹果 ...

苹果

假如通过id属性值没有找到指定的元素，那么浏览器会尝试寻找name属性值对应的元素如果要链接的是一个下载的资源，而不是在浏览器里打开时，可以实用download属性来提供一个默认的保存文件名：下载图片 仅适用于同源URL定位浏览上下文通过设置a元素的target属性，可以在不同的浏览上下文中打开超链接，浏览上下文可以是自定义的关键字（给某个窗口自定义一个名称），也可以用预定义的4个关键字：_blank: 表示一个新的未命名的浏览上下文，表现为在浏览器的新窗口打开超链接_self：表示当前浏览上下文，表现为在当前窗口打开超链接_parent：表示父级浏览上下文，_top：表示顶级上下文，如果没有顶级上下文则和 _self 一样列表有序列表（ordered list）ol元素 表示有序列表，列表项目使用 li元素 表示，该元素该没有定义任何局部属性，其呈现形式由CSS控制。列表项目可以通过ol元素定义的属性来控制：start属性 设定的是列首项的编号的开始，如果不用这个属性，那么首项的编号为1type属性 用来设定显示在各列表项旁的编号的类型，比如： type=1，表示十进制数（默认），type=a 表示小写拉丁字母，type=A 表示大写拉丁字母等如果使用了 reversed属性，那么列表编号采用降序也可以通过 li元素 的 value属性 修改列表项的计数值无序列表（unordered list）ul元素 表示无序列表，与ol元素一样，ul元素中的列表项用 li元素 表示。默认样式可以通过css属性list-style-type 控制。嵌套列表可以把一个列表签到在另一个列表中，不管是有序列表还是无序列表一般性内容span元素 和 div元素 本身没有具体的含义，可以包含任意内容一般使用场景是：给一段内容单独设置全局属性 或者 单独设置样式 参考：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element#内联文本语义高级排版说明文档定义说明列表要用到三个元素：dl、dt和dd元素：dl 表示说明列表dt 表示说明列表中的术语dd 表示说明列表中的定义插图插图的定义是：一个独立的内容单元，可带标题。通常作为一个整体被文档的主题引用，把它从文档主体中删除也不会影响文档的意思。figure元素 可以包含一个 figcaption元素，表示插图的标题，该元素必须是figure元素的第一个或最后一个子元素图片用 img元素 来嵌入一张图片，src属性 指定图片的地址，可以是一个绝对URL，也可以是一个相对URL。alt属性 定义了img元素的备用内容，此内容会在图像无法显示时呈现（原因也许是图像无法找到，图像格式不被浏览器支持，或者用户所用的浏览器或设备无法显示图像）。可以用 width属性 和 height属性 来指定 img元素 的尺寸大小，如果不指定这两个属性，img元素的尺寸就是图片本身的尺寸大小 不指定尺寸时，用户可能会感觉到晃动，因为浏览器会先确定其它元素的位置，然后再根据图片尺寸重定位屏幕上的内容来容纳 img元素，以便正确摆放网页里的各个元素内容分区标题HTML定义了一套标题元素体系，从h1一直到h6，h1级别最高，这些标题组成了文档的大纲hgroup元素可以用来将几个标题元素作为一个整体处理，比如说h1 标题下面并不是段落内容，下面有一个h2标题，在h2标题下面才是具体的段落内容

一级标题

二级标题

段落内容

页眉header元素 表示一节的页眉，里面可以包含各种适合出现在首部的东西，包括刊头或徽标该元素通常包含一个标题或一个hgroup元素，还可以包含该节的导航元素页脚footer元素 是header元素的配套元素，表示一节的页脚该元素通常包含着该节的总结性信息，还可以包含作者介绍、版权信息、到相关内容的链接、徽标及免责声明等导航nav元素 表示文档中的一个区域，它包含着到其它页面或同一页面的其它部分的链接该元素可以放在前面表示网站的导航，也可以放在后面为用户提供一些链接以便获取更多信息主内容main元素 表示文档的主体部分，核心内容节section元素 表示的是文档中的一节，通常包含一个或多个段落及一个标题，不过标题并不是必须的。该元素可以嵌套，每个元素内部都可以包含h1元素，浏览器会自动处理这些层次关系作为body元素子元素的header元素被视为整个文档的页眉，而作为某节组成部分的header元素只是该节的页眉侧边栏aside元素 用来表示跟周边内容稍沾一点边的内容，类似于书籍或杂志中的侧栏，其内容与页面其它内容有点关系，但并非主体内容的一部分，它可能是一些背景信息、到相关文章的链接、诸如此类独立内容article元素 代表HTML文档中的一段独立成篇的内容，可以独立于页面其余内容发布或使用，比如：一篇文章该元素可以嵌套使用，比如：article元素包含一篇文章，文章内的每一条评论也可以用article元素表示联系信息address元素 用来表示联系信息，可以放在body元素（表示整个文档的联系信息）或article元素（表示该article的联系信息）中。音视频视频使用video元素来嵌入视频： Video cannot be displayed 该元素有一些属性：src 指定视频来源autoplay 自动播放preload 是否预加载，可以取值 none（不加载）、metadata（只加载元数据，如宽高度、第一帧、长度等信息）、auto（下载整个视频，默认行为）controls 显示播放控件loop 反复播放视频poster 在视频载入时显示的图片height 指定高度width 指定宽度muted 静音由于并不是所有视频格式被浏览器所支持，所以可以同时指定多个视频格式，使用 source元素 可以做到这一点：还可以使用 media属性 向浏览器指名该视频最适合在哪种设备上播放，比如：all（所有设备）、tv（电视机）、screen（计算机显示器屏幕）、print（打印预览和打印页面）、handheld（手持设备）、projection（投影机）等等音频使用audio元素来嵌入音频，该元素和 video元素 用法是一样的，就是少了 height、width、muted、poster 这四个属性，也可以使用 source元素 指定多个音频格式，主要的音频格式有：mp3、ogg、wav等表格规则表格table元素 是HTML用以支持表格式内容的核心元素，它表示HTML文档中的表格tr元素 表示表格中的行，HTML表格是基于行而不是列，每个行必须分别标记td元素 表示表格中的单元格，每个新添加的td元素中的内容都比原有两行中的单元格的内容长，浏览器会调整其他单元格，让它们宽度一致th元素 用以说明td元素中包含的数据的含义tbody元素 表示构成表格主体的全体行tboot元素 用来标记组成表脚的行，可以把tfoot元素放在tbody元素之后或最后一个tr元素之后 即便在文档中表格没有用到tbody元素，大多数浏览器在处理table元素的时候，都会自动插入tbody元素。因此完全根据文档中的表格结构来设计的CSS选择器有可能不管用。例如，由于浏览器在table和tr元素之间插入了一个tbody元素，所以 table > tr 这个选择器会失效。为了应对这种情况，需要使用table > tobody > tr 或 table tr（没有字符>）这样的选择器，或者干脆写成 tbody > trcaption元素 可以用来为表格定义一个标题并将其与表格关联起来。一个表格只能包含一个caption元素。它不必是表格的第一个子元素，但是无论定义在什么位置，它总会显示在表格上方colgroup元素可以方便得给表格应用样式，里面的col元素代表负责的列，使用span属性让一个col元素可以关联多个列
1962-1964 度财务报表
季度 1962 1963 1964
Q1 $145 $167 $161
Q2 $140 $159 $164
Q3 $153 $162 $168
Q4 $157 $160 $171
总计 $595 $648 $664
不规则表格想让一个单元格纵跨多行要用rowspan属性，该属性的值代表所跨行数同样，想让一个单元格横跨多列要用colspan属性 rowspan和colspan设置的值必须是整数
表格标题
时间 星期日 星期二 星期三
上午8点 看球赛 看跳舞
下午9点 上网 运动 学习
下午10点 睡觉 运动
表格嵌套一个表格里面可以嵌套另一个表格：
...
... ...
表格常用属性table的属性width: 规定表格的宽带，可以是像素或百分比align: 表格相对周围元素的对齐方式，可以是left、center、rightborder：规定表格边框的宽度，单位是像素bgcolor：表格的背景颜色cellpadding：单元边沿与其内容之间的空白，单位可以是像素也可以是百分比cellspacing：单元格之间的空白，单位可以是像素或百分比frame：规定外侧边框的哪个部分是可见的，有以下值：void: 不显示外侧边框above：显示上部和外侧边框below：显示下部的外侧边框hsides：显示上部和下部的外侧边框vsides：显示左边和右边的外侧边框lhs：显示右边的外侧边框box：在所有四个边上显示外侧边框border：在所有四个边上显示外侧边框rules：规定内侧边框的哪个部分是可见的nonne：没有线条groups：位于行组合列组之间的线条row：位于行之间的线条cols：位于列之间的线条all：位于行和列之间的线条tr的属性align: 行内容的水平对齐，可以是left、center、right、justify、charvalign：行内容的垂直对齐，可以是top、middle、bottom、baselinebgcolor：行的背景颜色td和th标签属性align：单元格内容的水平对齐，可以是left、center、rigght、justify、charvalign：单元格内容的垂直对齐，可以是top、middle、bottom、baselinebgcolor：单元格的背景颜色width：单元格的宽度height：单元格的高度thead、tbody和tfoot的属性align：水平对齐，可以是 left、center、right、justify、charvalign：垂直对齐，可以是 top、middle、bottom、baseline表单创建表单form元素表示HTML页面上的表单，action属性说明了提交表单时浏览器应该把从用户收集的数据发送到什么地方，method属性 指定了用来将表单数据发送到服务器的HTTP方法，允许的值有get和post这两个，它们分别对应于HTTP的GET和POST方法，未设置method属性时使用的默认值为get，input元素 是表单输入元素的一种，用来收集用户的输入数据，在浏览器中显示为一个简单的文本框，用户就是在这个文本框中输入内容label元素 为表单中的每一个输入元素提供说明，该元素可以独立于输入元素，也可以包含输入元素。当独立于输入元素时，可以设置一个for属性，用来与对应的输入元素关联，被关联的输入元素必须设置一个与for属性值相同的。关联之后，当用户点击label元素上的文字后，对应的输入元素就会自动获得焦点用户按下type=submit的button元素后就可以将表单里面的数据提交给服务器，只设置了name属性的表单元素的数据才会提交，提交的数据内容格式为：first_name=xxx&last_name=yyyautocomplete属性可以让浏览器根据以前填写过的记录自动填入数据到表单中，各个input元素也可以设置该属性来覆盖form元素的autocomplete属性target属性可以控制浏览器提交表单后返回的窗口，和a元素的target属性一样的

Account

Last Name:

对表单元素进行组织可以使用fieldset元素将一些元素组织在一起，可以在每一个fieldset元素中添加一个legent元素即可向用户提供相关说明，该元素必须是fieldset元素的第一个子元素通过设置fieldset元素的disabled属性，可以一次性地禁用多个input元素。此时fieldset元素中包含的所有input元素都会被禁用
账户信息

Account

......
地址信息

Address

......
个人信息

Public Profile

......
表单元素属性value：设置一个默认值placeholder：设置一段提示文字，告诉用户应该输入什么类型的数据autofocus：自动聚焦到元素上。如果有多个元素设置了该属性，则浏览器将会自动聚焦于其中的最后一个元素size：设定了文本框能够显示的字符数目（对用户能够输入的字符数目未作限制）maxlength：设定了用户能够输入的字符的最大数目autocomplete：是否自动完成表单内容disabled：文本框内容不能被编辑，数据不会被发送到服务器readonly：文本框内容不能被编辑，数据会被发送到服务器表单元素类型文本输入input元素默认情况的type属性就等于texttext型input元素表示一个普通的文本输入框：数值输入number型input元素只允许输入数字（包括整数和小数），输入框里面会出现数字加减按钮，点击加减按钮可以对值进行调节，默认每次调节只加/减的单位是1，可以通过设置属性step来调节数值的步长：时间和日期输入框 密码password型input元素用于输入密码，用户输入的字符在这种文本框中显示为星号（*）之类的掩饰字符电子邮件框、搜索框、电话框、URL框 搜索search型input元素回生成一个搜索文本框，供用户输入搜索用词多行文本textarea元素表示多行文本，cols属性表示列数，rows元素表示行数：复选框type=checkbox表示复选框，其name属性的值后面应该加一对中括号，表示多个值 单选按钮 选择框普通选择框select元素表示一个选择框，option元素表示选择框里面的每一项 分组选择框可以使用optgroup元素把不同类别的option元素分组展现，其label属性可以用来为整个组选项设置一个小标题： 上传文件file型input元素用来上传文件，该元素有2个额外属性：accept 指定接受的MIME类型multiple 设置这个属性的input元素可一次上传多个文件
隐藏字段提交和重置button元素的type属性默认值就等于button，表示一个单纯的按钮如果给input元素和button元素的type属性设置为submit，那么就可以用来提交表单内容到服务器如果给input元素和button元素的type属性设置为reset，那么就可以用来重置表单内容 正常情况下，提交和重置按钮元素应该位于form表单里面才会生效，也可以把这两个元素放在form元素外面，只需要通过按钮的form属性与form元素的id属性关联起来就行了：
...