网站是指在因特网上根据一定的规则，使用 HTML 等制作的用于展示特定内容相关的网页集合。网页是网站中的一“页”，通常是 HTML 格式的文件，它要通过浏览器来阅读。网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以 .htm 或 .html 后缀结尾的文件，因此将其俗称为 HTML 文件。
Web 标准是由 W3C 组织和其他标准化组织制定的一系列标准的集合。W3C（万维网联盟）是国际最著名的标准化组织。
注意事项
HTML5是用来描述网页的一种语言，被称为超文本标记语言。用HTML5编写的文件，后缀以.html结尾HTML是一种标记语言，标记语言是一套标记标签。标签是由尖括号包围的关键字，例如：<html>
标签有两种表现形式：
DOCTYPE是document type (文档类型) 的缩写。<!DOCTYPE html >是H5的声明位于文档的最前面，处于标签之前。他是网页必备的组成部分，避免浏览器的怪异模式。
定义 HTML 文档，这个元素我们浏览器看到后就明白这是个HTML文档了，所以你的其它元素要包裹在它里面，标签限定了文档的开始点和结束点。
head标签用于定义文档的头部。文档的头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
body 元素定义文档的主体。body 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）它会直接在页面中显示出来，也就是用户可以直观看到的内容
SEO是搜索引擎优化的英文缩写。通过对网站内容调整，满足搜索引擎的排名需求
meta标签用来描述一个HTML网页文档的属性，关键词等，例如：charset="utf-8"是说当前使用的是utf-8编码格式，在开发中我们经常会看到utf-8，或是gbk，这些都是编码格式，通常使用utf-8。
小试牛刀1. 以下组成HTML5基础骨架标签正确的是:A <html>、<body>、<head>、<div>、<meta>
B <html>、<body>、<DOCTYPE>、<title>、<meta>
C <html>、<body>、<head>、<title>、<meta>
D <html>、<body>、<!DOCTYPE html>、<title>、<meta>答案：C
标题（Heading）是通过 <h1> - <h6> 标签进行定义的。<h1>定义最大的标题 <h6>定义最小的标题
生成h1~h6快捷键：h$*6
正确使用标题请确保将 HTML 标题标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。正确使用标题有益于SEO应该将< h1> 用作主标题（最重要的），其后是 <h2>（次重要的），再其次是 <h3>，以此类推标题标签位置摆放在标签中添加属性：align="left | center | right" 默认居左
段落是通过<p>标签定义的
运行效果
这是一个段落
这是另一个段落
如果您希望在不产生一个新段落的情况下进行换行（新行），请使用 <br><br /> 元素是一个空的 HTML 元素。
<hr/>标签在 HTML 页面中创建水平线
属性：
A <p>标签
B <hr>标签
C <br>标签
D <img>标签2. 承载段落文本信息使用以下那个标签:
A <p>标签
B <hr>标签
C <br>标签
D <img>标签答案1=>C 2=>A
<div> 和 <span> 是没有语义的，它们就是一个盒子，用来装内容的div 是 division 的缩写，表示分割、分区。span 意为跨度、跨距。特点：
网站中最多的元素毋庸置疑，一定是图片<img> 标签定义 HTML 页面中的图像
注意事项
<img>是单标签，不需要进行闭合操作属性：
A 规定图像的替代文本
B 鼠标悬停在图片上给予提示
C 路径（图片地址与名字）
D 规定图像的宽度和高度2. 以下那个不是<img>标签的属性：
A src
B alt
C title
子级关系: /
父级关系: ../
同级关系: ./（可以省略）
A 相对路径是电脑的盘符存储与访问的具体地址
B 相对路径是两者相对关系，两者在同⼀路径下可以直接访问
C 相对路径是具体的⽹络地址
D 相对路径是不存在的答案1=>C 2=>B
一个未访问过的链接显示为蓝色字体并带有下划线。
访问过的链接显示为紫色并带有下划线。
点击链接时，链接显示为红色并带有下划线。
链接分类：
特别提示
后期我们会通过CSS样式修改掉这些效果
当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手实时效果反馈
1. 超链接的作用是
A 跳转到新的文档
B 显示图片的标签
C 显示段落的标签
D 显示标题的标签
A 设置超链接的宽度和高度
B 设置超链接的跳转地址
C 设置超链接的显示颜色
D 设置超链接的文本内容答案1 =>A 2=>B
特别提示
常用文本标签和段落是不同的，段落代表一段文本，而文本标签一般表示文本词汇
实时效果反馈
1. 定义加重语气的标签是哪一个：
A em
B <i>
C <del>
D <strong>
2. 定义着重文字的标签是哪一个：
A em
B <i>
C <del>
D <strong>
答案1=>D 2=>A
有序列表是一列项目，列表项目使用数字进行标记。 有序列表始于 <ol>(ordered list)标签。每个列表项始于 <li> (list)标签。
<ol>的属性type 拥有的选项
列表是可以进行嵌套的
实时效果反馈
1. 有序列表展示效果以下那个描述是正确的：
A 展示一个段落效果
B 展示一个无序的列表效果
C 展示一个有序的列表效果
D 展示一个加粗的文本效果
2. 有序列表的标签组合正确的是：
A <ul> + <li>
B <ol> + <li>
C <h1> + <li>
D <img> + <li>
答案1=>C 2=>B
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记
无序列表始于 <ul> 标签。每个列表项始于 <li> 标签。
<ul>的属性type 拥有的选项
disc 默认实心圆
circle 空心圆
square 小方块
none 不显示
列表是可以进行嵌套的
快捷键快速生成ul+li的布局：ul>li3（数字根据自己的需要的li数量修改）同理，也有ol>lin（n为想要生成列表项的个数）'>'表示后者是前者的子元素
实时效果反馈
1. 无序列表的type属性以下描述错误的是：
A disc 默认实心圆
B circle 空心圆
C square 小方块
D triangle 三角形
2. 无序列表的标签组合正确的是：
A <ul> + <li>
B <ol> + <li>
C <h1> + <li>
D <img> + <li>答案1=>D 2=>A
行、列、单元格
单元格特点：同行等高、同列等宽。
表格标签
表格：<table>
行：<tr>，行数取决于<tr>个数单元格(列)：<td>，列数取决于<td>个数
快捷键
快速生成表格结构：table>trn>tdm{单元格} //n为行数，m为列数，{}表示单元格内容
1. 以下那个是表格组成标签组合：
A table + tr + td
B table + tr + dl
C ul + tr + td
D ul + table + tr
2. 以下代码，空格处要填写的标签：
A <th> </th>
B <tbody> </tbody>
C <td> </td>
D <tr> </tr>
答案
1=>A 2=>D
实时效果反馈
1. 下列那个是单元格垂直合并的属性：
A border
B align
C colspan
D rowspan
答案
1=>D
表单是由容器和控件组成的,一个表单一般应该包含用户填写信息的输入框,按钮等，这些输入框,按钮叫做控件,表单就是容器,它能够容纳各种各样的控件
属性说明
action服务器地址
name表单名称
method中Get和Post的区别
表单元素主要有：input 输入表单元素 select 下拉表单元素 textarea 文本域表单元素一个完整的表单包含三个基本组成部分：表单标签<form>、表单域（要输入的区域）、表单按钮
实时效果反馈
1.以下哪个元素不是表单元素：
A 表单标签
B 表单域
C 表单按钮
D 图片
答案
1=>D
单行输入文本框通过<input type="text"> 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域。通常浏览器限制最大输入字符数时20个
密码字段通过标签<input type="password"> 来定义
温馨提示
密码字段字符不会明文显示，而是以星号或圆点替代
通过标签<input type="radio"> 来定义
通过标签<input type="checkbox"> 来定义
通过标签<input type="button"> 来定义。点击按钮后不会提交表单，常配合JS完成某项动作
多行输入用<textarea></textarea>表示可以自行调节大小，cols和rows只是设置多行输入文本框的初始大小
label标签常配合表单中的元素使用。<label>标签用于绑定一个表单元素, 当点击<label>标签内的文本时，浏览器就会自动聚焦输入框或选择对应的表单按钮元素,用来扩大触发或联动控制，这样可以用户体验通过设置<label> 标签的 for 属性等于对应元素的 id 属性来产生关联
实时效果反馈
1.设置输入框为密码框，type属性应该填写内容：
A text
B password
C radio
D name
答案
1=>B
使用场景: 如果有多个选项让用户选择，但又想要节约页面空间语法
HTML5出现之前，经常把元素按照块级元素和内联元素来区分。在HTML5中，元素不再按照这种⽅式来区分， 而是按照内容模型来区分，分为元数据型(metadata content)、区块型(sectioning content)、标题型(heading content)、文档流型(flow content)、语句型(phrasing content)、内嵌型(embedded content)、交互型 (interactive content)。元素不属于任何⼀个类别，被称为穿透的，元素可能属于不止⼀个类别，称为混合的
虽然到了HTML5的版本，元素分类更细致了，但是这对初学者并不友好,所以我们仍然按照块元素和内联元素做区分，这对我们的布局起到了至关重要的作用
内联元素和块级元素的区别
常见块级元素（独占一行，可识别宽高）
div、form、h1~h6、hr、p、table、ul、等
常见内联元素(只占自身大小，不可识别宽高)
a、b、em、i、span、strong等
行内块级元素（特点：不换行、能够识别宽高）
button、img、input等
实时效果反馈
1.下列关于元素分类描述错误的是：
A 块元素会在页面中独占一行,行内元素不会独占页面中的一行，只占自身的大小
B 块元素可以设置width，height属性,行内元素设置width，height属性无效
C ⼀般块级元素可以包含行内元素和其他块级元素,⼀般内联元素包含内联元素不包含块级元素
D 块元素可以设置大小,不会独占一行,行内元素无法无法设置大小,但是会独占一行
答案
1=>D
狭义的H5：HTML5 结构标签本身广义的HTML5： 广义的 HTML5 是 HTML5 本身 + CSS3 + JavaScript 。
HTML5 的新增特性主要是针对于以前的不足，增加了一些新的标签、新的表单和新的表单属性等。HTML5是HTML最新的修订版本，2014年10月由万维网联盟（W3C）完成标准制定
注意：
实时效果反馈
1.下列哪个不属于HTML5的新增标签
A <header></header>
B <div></div>
C <footer></footer>
D <nav></nav>
自定义数据属性以data-开头，自定义属性存放在元素节点.dataset中，元素节点.dataset中的属性名都会变成小写
答案
1=>B
使用它们可以很方便的在页面中嵌入音频和视频，而不再去使用 flash 和其他浏览器插件
<datalist> 为 <input>输入框提供了可能的选项，用户可以选择这些选项实现自动填充，也可以随意输入非候选项<datalist> 标签被用来在为 <input> 元素提供"自动完成"的特性。用户能看到一个下拉列表，里边的选项是预先定义好的，可以作为用户的输入数据。请使用 <input> 元素的 list 属性来绑定 <datalist> 元素。
<canvas> 标签定义图形，比如图表和其他图像，您必须使用脚本来绘制图形。HTML5 <canvas> 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成.<canvas> 标签只是图形容器，您必须使用脚本来绘制图形。你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像
SVG 定义为可缩放矢量图形。HTML5 支持内联 SVG。HTML <svg> 元素是 SVG 图形的容器。SVG 有多种绘制路径、框、圆、文本和图形图像的方法SVG 指可伸缩矢量图形 (Scalable Vector Graphics)SVG 用于定义用于网络的基于矢量的图形SVG 使用 XML 格式定义图形SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失SVG 是万维网联盟的标准
与其他图像格式相比（比如 JPEG 和 GIF），使用 SVG 的优势在于：SVG 图像可通过文本编辑器来创建和修改SVG 图像可被搜索、索引、脚本化或压缩SVG 是可伸缩的SVG 图像可在任何的分辨率下被高质量地打印SVG 可在图像质量不下降的情况下被放大
运行结果经度：23维度：123点我
color 类型用在input字段主要用于选取颜色，如下所示：
选择你喜欢的颜色:
date 类型允许你从一个日期选择器选择一个日期。
生日:
email 类型用于应该包含 e-mail 地址的输入域。在提交表单时，会自动验证 email 域的值是否合法有效
month 类型允许你选择一个年月。
number 类型用于应该包含数值的输入域。可以限定数字的范围
数量 ( 1 到 5 之间):
range 类型用于应该包含一定范围内数字值的输入域。range 类型显示为滑动条
Points:
max - 规定允许的最大值min - 规定允许的最小值step - 规定合法的数字间隔value - 规定默认值
url 类型用于应该包含 URL 地址的输入域。在提交表单时，会自动验证 url 域的值。
添加你的主页:
week 类型允许你选择周和年。
选择周:
所有HTML元素共有的属性。全局属性可以作用于所有元素，即使可能对某些元素不起作用。可以在所有的HTML元素上指定全局属性