共计 5888 个字符，预计需要花费 15 分钟才能阅读完成。
html: 不是一种编程语言，而是一种标记语言。应用.html 与.htm 作为 HTML 文件的后缀名；
html 版本：HTML 1.0：1993 年 6 月
HTML 2.0：1995 年 1 1 月
HTML 3.2：1997 年 1 月 14 日
HTML 4.0：1997 年 12 月 18 日
HTML 4.01（渺小改良）：1999 年 12 月 24 日
HTML 5：2014 年 10 月
HTML 特点：繁难性，可扩展性，平台无关性，通用性
html 与 css 之间的关系：HTML 是网页内容的载体；
CSS 款式是体现；
html 正文：<!– 正文内容 –> 记录编程思路，解释阐明业务性能
html 外围属性：title、id、class、style
title：形容信息
id：惟一标识
class：标识一类元素
style 款式
空白：在文档中无论呈现多少个空白或者换行，浏览器都解析为一个空白
空格： 
<：<
>
块级元素：
特点：
- 独占一行空间
- 默认宽度为 100%
- 高度由子元素或内容决定
-
能够通过 css 指定其宽度
元素：html、body、div、p、h1~h6、ul->li、ol->li、dl->dd/dt、header、footer、nav、article、section、aside、address
行内元素：
特点：
- 与其余行内元素共享一行空间
- 宽高由本身决定
- 因为不用来搭建网页构造，所以也无需通过 css 指定其宽度
- 行内元素中不能够嵌套块元素
-
元素：span、a、img、strong、b、i、em、sub、sup
块级元素与行内元素的区别：
1. 经典：块级元素独占一行，行内元素与其余元素共享一行。
2. 宽高：块级能够间接设置宽高，行内不能够间接设置宽高，须要通过
display 扭转元素属性来设置。（img、input 非凡的行内，置换元素）
3. 块级元素能够蕴含块级与行内，行内只能蕴含行内。根底标签的应用：
h 标签：h1 标签十分重要，它会影响到页面在搜索引擎中的排名，一个页面最好只写一个 h1 标签
eg:
<h1> 这是一个 h1 标签 </h1>p 标签:p 标签中的文字，会独占一行，并且段与段之间会有一个间距
eg:<p></p>
br 标签: 不另起一个段落换行
hr 标签: 在页面中生成一个分割线
字符实体: 空格
< <>“"& &‘‘
img 标签:
alt: 能够用来设置在图片不能显示的时，对图片的形容
title：用于通知浏览器，鼠标悬停的时候，须要弹出的形容框中显示什么内容
eg:<img src=” 图片的 url 或本地门路地址 ” alt=”” width=”100px” height=”100px” title=””>
留神点：
1.px 单位名称为像素，绝对长度单位，像素 px 是绝对于显示器屏幕分辨率而言的。像素的应用性特
别广。
2. 如果不设置 img 标签的宽度和高度，那么图片就会依照默认的款式显示，如果设置了宽高，img 就
会依照设置的宽高来显示。
3. 有时设置 img 的宽高会使图片失真，这时只须要设置宽度或者高度中的一个，另外一个会等比例调整。
4. 个别除了自适应的页面，不倡议设置 width 和 height。
5. 和 h 标签以及 p 标签不同的是，img 标签不会独占一行
a 标签: 管制页面与页面之间跳转
target: 用于管制如何跳转
self: 用于以后的选项卡中进行跳转，也就是不新建页面跳转，默认就是_self
_blank: 用于在新的选项卡中进行跳转，也就是新建页面跳转
留神点:
1.a 标签不仅能够让文字点击，也能够让图片被点击
2. 一个 a 标签必须有一个 href 属性，否则 a 标签不晓得要跳转到什么中央
3. 如果通过 a 标签 href 属性指定一个 URL 地址，那么必须在地址后面加上 http:// 或者 https://
除了 URL 地址，还能够指定一个本地地址
eg:<a href="https://www.baidu.com" target="_blank" title="百度"> 百度一下 </a>
mailto 链接: 一种 html 链接，可能设置你电脑中邮件的默认发送信息
eg:<a href="mailto:name@email.com">Email</a>
base 标签: 对立指定以后页面中所有的 a 标签须要如何关上
留神点
1.base 标签必须要写在 head 标签之间
2. 如果既在 base 中指定了 target 又在 a 标签中指定了 target，那么浏览器会依照 a 标签中指定的来执行
eg:<base target=”_blank”>
假链接:
1.# 间接回到页面的顶部
2.javascript: 不会主动回到页面的顶部
<a href="#"> 回到顶部 </a>
<a href="javascript:"> 点我啊 </a>
锚点:
留神点:
1. 通过咱们的 a 标签跳转到指定的地位, 是没有适度动画的, 是间接一下子就跳转到了指定地位
2.a 标签除了能够跳转到以后界面的指定地位以外, 还能够在跳转到其它界面的时候间接跳转到其它界面的指定地位
跳转到其余页面：<a href="b.html#bottom" target="_blank"> 跳转 </a>
在以后页面中进行跳转：<a href="#center"> 跳转 </a>
<p id=”center”> 我是中部 </p>
em: 强调，突出文章重点
strong: 意为强调，内容更为有用
b: 加粗
i: 斜体
u: 下划线
video(播放视频):
src: 通知 video 标签须要播放的视频地址
autoplay: 用于通知 video 标签是否须要自动播放视频
controls: 用于通知 video 标签是否须要管制条
poster: 用于通知 video 标签视频没有播放之前显示的占位图片
loop: 个别用于做广告视频，用于通知 video 标签视频播放结束之后是否须要循环播放
muted: 静音
eg1:`<video>
<source src=""type=""></source>
<source src=""type=""></source></video>`
eg2:<video src=""></video>
audio(播放音频)
有 3 个属性不能用, height/width/poster
HTML5 新增语义化标签:
header: 具备疏导和导航作用的构造元素，通常用来搁置整个页面或页面内的一个内容区块的题目，但也能够蕴含搜寻表单或 logo
nav: 用作页面导航的链接组，其中导航元素链接到其余页面或以后页面的其余局部
article: 代表文档，页面或应用程序中独立的，残缺的，能够单独被内部援用的内容，也能够嵌套应用。能够是一篇博客或者报刊中的文章，一篇论坛帖子，一段用户评论或者独立的插件，或其余任和独立的内容
section: Html 文档独立的性能
aside: 示意以后页面或文章的从属信息局部，它能够蕴含以后页面或次要内容相干的援用，侧边栏，广告，导航条，以及其余类型的有别于次要内容的局部
footer: 其下层父级内容区块或是一个根区块的脚注
address: 用来在文档中出现分割信息，包含文档作者或文档维护者名字
figure& figcaption: figure 元素用来示意网页上一块独立内容，将其从网页上移除后不会对网页上的其余内容产生任何影响
figure 元素所示意的内容能够是图片，统计图或代码示例，也能够是音频插件，视频插件，统计表格等。
figcaption 元素示意 figure 元素的题目，它从属于 figure 元素，必须书写在 figure 元素外部。
一个 figure 元素内最多只容许搁置一个 figcaption 元素，然而容许搁置多个其余元素。
details: 标识该元素外部的子元素能够被开展, 膨胀显示的元素。details 元素内并不仅限于搁置文字，也能够搁置表单, 插件或对于一个统计图提供的具体数据表格。
open 属性: 属性值为 true 时，该元素外部的子元素应该被开展显示；当该属性的值为 false 时，其外部的子元 素应该被收缩起来不显示。默认值为 false
summary 子元素: summary 元素从属于 details，用鼠标单击 summary 元素中的内容文字时，details 元素中的其余所有隶属元素将会开展或膨胀。如果 details 元素内没有 summary 元素，浏览器会提供默认文字 (详细信息) 以供 单击。
性能元素
列表标签：给一堆数据增加列表语义, 也就是通知搜索引擎通知浏览器这一堆数据是一个整体
无序列表:ul>li
留神点:
1.ul 标签是用来给一堆数据增加列表语义的, 而不是用来给他们增加小圆点的
2.ul 标签和 li 标签是一个整体, 是一个组合. 所以个别状况下 ul 标签和 li 标签都是一起呈现, 不会单个呈现。也就是说不会独自应用一个 ul 标签或者独自应用一个 li 标签, 都是联合在一起应用
3. 因为 ul 标签和 li 标签是一个组合, 所以 ul 标签中不举荐蕴含其它标签, 也就是说当前你在 ul 标签中只会看到 li 标签
有序列表：
给一堆数据增加列表语义, 并且这一堆数据中所有的数据都有先后之分
有序列表款式：1 默认值。数字有序列表。（1、2、3、4）
a 按字母顺序排列的有序列表，小写。（a、b、c、d）
A 按字母顺序排列的有序列表，大写。（A、B、C、D）
i 罗马字母，小写。（i, ii, iii, iv）
I 罗马字母，大写。（I, II, III, IV）
定义列表：给一堆数据增加列表语义，先通过 dt 标签定义列表中的所有题目, 而后再通过 dd 标签给每个题目增加形容信息
留神点
1. 和 ul/ol 一样, dl 和 dt/dd 是一个整体, 所以他们个别状况下不会独自呈现, 都是一起呈现
2. 和 ul/ol 一样, 因为 dl 和 dt/dd 是一个组合标签, 所以 dl 中倡议只放 dt 和 dd 标签
3. 一个 dt 能够没有对应的 dd, 也能够有多个对应的 dd, 然而无论有或者没有 dd 都不举荐应用.
4. 举荐应用一个 dt 对应一个 dd
5. 和 li 标签一样, 当须要丰盛界面时, 咱们能够在 dt 和 dd 标签中持续增加其它标签
表格标签：用来给一堆数据增加表格语义，一种数据的展示模式
留神点：
表格标签有一个 border 边框属性, 这个属性决定了边框的宽度. 默认状况下这个属性的值是 0, 所以看不到边框表格标签和列表标签一样, 它是一个组合标签, 所以 table/tr/td 要么一起呈现, 要么一起不呈现, 不会单个呈现
表格的宽高：默认是依照内容的尺寸来调整的
手动扭转：table 的 width、height
单元格的宽高：td 的 width、height（行内款式：style=“color:red;background-color:white”优先级最高）表格内单元格的程度、垂直对齐：
程度：align table(表格程度对齐形式)、tr、td（以后单元格内容的程度对齐形式）垂直：valign tr、td（单元格中的内容, 在垂直方向的对齐形式.）表格的外边距与内边距属性：
cellspacing 外边距：单元格和单元格之间的间隔，默认状况下是 2px
cellpadding 内边距：单元格的边框和文字之间的间隙（调整表格内内容与边框的间隔）默认状况下是 1px单元格合并：
colspan 程度方向上的单元格合并，合并列
rowspan 垂直方向上的单元格合并，也就是合并行
form 表单：
表单元素肯定要写在表单中
`<for`m>`
`< 表单元素 >`
</form>`
根本表单元素
明文输入框 <input type="text">
暗文输入框 <input type="password"> 加密操作
单选框 <input type="radio" name="xx" value="xxx" checked>
checked 默认选中
互斥操作：给每一个单选框设置雷同的 name 属性还必须设置雷同的值。多选框 <input type="checkbox" name="xxx" value="xxx" checked>
提交按钮 <input type="submit">
作用: 将表单中曾经填写好的数据, 提交到近程服务器。（action 属性：服务器地址）【注：若想将表单数据提交给后盾，表单元素须要有 name 属性。】一般按钮 <input type="button" value="xxx">
图片按钮 <input type="image" src="">
重置按钮 <input type="reset" value="xx"> 清空表单中曾经填写好的数据
Http 协定：
http 协定是超文本传输协定，罕用于 BS 架构中，为数据在网络传输中规定协定。
HTTP 是一种可能获取如 HTML 这样的网络资源的 protocol(通信协定)。它是在 Web 上进行数据交换的根底，是一种 client-server 协定，也就是说，申请通常是由像浏览器这样的接受方发动的。
HTTP 报文的分类有两种：申请报文和响应报文。顾名思义，申请报文就是客户端向服务端发送申请的信号，响应报文就是服务端响应解决后回传给客 户端的信号。
申请报文：浏览器会将前端申请封装成申请报文发送给后端，申请报文中蕴含申请行、申请头、申请体
响应报文：服务器接管到前端发来的申请，会将响应内容封装成为一个响应报文，浏览器会对响应报文进行解析，进而显示进去。响应报文中蕴含响应行、响应头、响应体
GET /index.php HTTP/1.1，GET 是申请办法，/index.php 是 URL，HTTP/1.1 示意应用的 HTTP 版本为 1.1。
申请形式
get 与 post 申请的区别？面试题
get 传输数据量小 参数携带在 URL 前面 没有申请体 没有数据保密性 /index.php?id=100&slec=yes
post 传输数据量大 参数携带在申请体里 数据保密性强（swagger-login/register）cookie
把用户的爱好在电脑本地进行了一个记录，当用户下次再浏览雷同网页时，会在电脑本地拿到 cookie，进行爱好筛选举荐。申请头
Host：申请的主机名，容许多个域名同处一个 IP 地址，即虚拟主机。eg: 百度 ---- sp1.baidu.com。空行
用作申请头与申请体之间的内容宰割
申请体
蕴含申请携带数据，所以，get 是没有申请体的。响应报文：状态行、响应头、空行、响应体
状态行 通知前端申请是否正确，若谬误，通过状态码剖析谬误起因，调整 bug
200 胜利
4XX 前端申请谬误，url/ 申请数据格式谬误 / 语法错误 /...
5XX 服务器端谬误，分割后盾人员解决
响应头
Content-Type：返回的资源类型 (MIME)；Connection：连贯形式；close/keep-alive
close：连贯曾经敞开；keep-alive：连贯已放弃，在期待本次连贯的后续申请；空行
分隔响应头与响应体
响应体
返回给前端的数据，响应信息
