HTML

这个整理的也挺好的 https://www.cnblogs.com/suoning/p/5614372.html

1、HTML（结构）、CSS（样式）、JS（行为）

2、网页基本结构

<html>
    <head>
        <!-- 头部内容 -->
    </head>
    <body>
        <!-- 主体内容 -->
    </body>
</html>

3、HTML的特点：标签成对出现；结束标签内用/开头；标签可以嵌套

4、DOCTYPE

定义：声明位于文档中的最前面的位置，处于<html>标签之前。此标签可告知浏览器文档使用哪种HTML或XHTML规范。

标记和浏览器的兼容性相关，删除后就是把如何展示HTML页面的权利交给浏览器，不同浏览器会按照其默认的规范解析。

5、html标签：只能包含head和body，属性 lang="en" lang="zh-cn" 用于设置语言

6、head标签：将页面的一些额外信息告诉服务器。不会显示在页面上

可以用在 <head> 里面的标签有： <title> , <base> , <link> , <style> , <meta> , <script> , <noscript> 。

　具体内容请看这里：https://www.cnblogs.com/leyili/p/head.html

7、meta标签

重点：

详细：https://www.cnblogs.com/koto/p/5659627.html

8、body标签：

块级标签:p、div、ul、ol、li、dl、dt、dd、h1~h6、form、hr

行内标签:a、span、em、strong、b、i、u、label、br

行内块：img,input,textarea

基本标签（<h1>~<h6>、<p>、<b> <strong>、<strike>、<u>、<em> <i>、<sup>、<sub>、<br>、<hr>、<div>、<span>）

特殊符号（>、<、 、"、©...）

<a> 超链接标签(锚标签)（href、target、name）

<img> 图形标签（src、title、alt、width、height、align）

列表标签（<ul>、<ol>、<li>、<dl>、<dt>、<dd>）

<table> 表格标签（<table> 、<caption> 、<tr>、<th>、<td>、<thead>、<tbody>、rowspan、colspan）

<from> 表单标签（action、method、enctype、<input>、<textarea>、<select>、<label>、<fieldset>）

pre 可以直接写内容，浏览器展现与编写的内容一致，不解析空格换行

详细：https://www.cnblogs.com/guapitomjoy/p/11668540.html

9、列表

<ul> :无序列表标签

<li>:列表中的每一项.

<ol> :有序列表标签

<li>:列表中的每一项.

<dl> 自定义列表

<dt> 列表标题

<dd> 列表项

注意嵌套规则

10、表格

<table border="1">
    <thead>
        <tr>
            <th>序号</th>
            <th>姓名</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1.</td>
            <td>nick</td>
        </tr>
        <tr>
            <td>2.</td>
            <td>jenny</td>
        </tr>
    </tbody>
</table>

<table> 表格标签

border:（表格边框）
align（水平对齐方式）
bgcolor（背景颜色）
cellpadding（内边距，单元格与内容之间的距离）
cellspacing（外边距，单元格的间距，设置为0时，表格变为实线表格）
width（表格的宽度，可以用%或者像素，最好通过css来设置长宽）

<caption> 表格的标题

<tr> 表格的数据行，table row

<th> 表格的表头名称，与<td>不同在于文字采用加粗居中的形式显示，table head cell

<td> 单元格，用来显示表格内容，table data cell

<thead> 表格头部，使结构更加分明

<tbody> 表格主体部分，使结构更加分明

rowspan 单元格竖跨多少行，作用在th或者td上

colspan 单元格横跨多少列（即合并单元格），作用在th或者td上

11、超链接

<a> 超链接标签(锚标签)

重要属性有三个：href、target、name

　　　　href 超链接地址：可以是Web上任意资源，包括图片，网页，样式，脚本文件等。href="#"时，表示被链接页面就是当前页面。

　　　　target 文档打开时要显示的目标位置，属性值一般有：

　　　　　　_blank（新窗口中打开）、

　　　　　　_self（默认，在超链接所在的容器中打开）、

　　　　　　_parent（在超链接的父容器中打开）、

　　　　　　_top（整个容器中打开）、

　　　　　　name（框架名称）。

　　　　name 锚记名称。作用：跳转到文档的某个地方。返回首页。

12、图片

行级标签，用来显示图片。

重要属性有：src、title、alt、width、height、align。

　　　　src 图片地址。

　　　　title 鼠标悬浮在图片上的文字。

　　 alt 图片找不到时要替换的文字。如果图片资源使用的是外网资源，则不会显示要替换的文字。如果使用的是本网站的资源（相对路径给出），则找不到图片时会显示替换的文字，并保留图片设置的宽高结构。

　　　　align 图片周围文字的垂直对齐情况。常用的属性值有：top（与图片的顶部对齐）、middle（与图片的中部对齐）、bottom（默认，与图片的底部对齐）。

width 图片的宽

height 图片的高 (宽高两个属性只用一个会自动等比缩放.)

13、图片种类

详细：https://www.cnblogs.com/xiangism/p/5311314.html

详细: https://www.cnblogs.com/weinan/archive/2012/12/04/2801918.html

14、URL

详细：https://www.cnblogs.com/phpstudy2015-6/p/6810130.html

URL语法可以归纳到下面的通用格式上：

<scheme>://<user>:<password>@<host>:<port>/<path>;<params>?<query>#<frag>

scheme：方案名，常见的是http/https/ftp/mail等协议。方案名是大小写无关的，即http://www.baidu.com与HTTP://www.baidu.com是等价的。
user：用户名，在http协议中比较少见，默认值是匿名用户"anonymous"
password：密码，与上面的user性质相同。在ftp协议中是比较常见的，比如ftp://user:password@ftphost/download。如果不指定密码，不同的浏览器实现会发送不同的默认密码。
host：主机，资源的具体承载机器。一般使用域名或者IP来表示，使用IP的可以直接定位到具体机器，而使用域名的需要经过DNS解析后获得IP。
port：端口，机器上的具体应用。在一台机器上一个端口对应一个应用，有了host+port就定位到资源的具体应用上了。http协议的默认端口是80，https的默认端口是443。
path：路径，资源的分级目录。类似于文件系统的路径，可以使用多个/进行层级分割，每层都可以跟参数。
params：路径对应的参数，不常用但合法。比如：http://www.baidu.com/china;type=a/beijing;degree=b
query：查询字符串，与后端程序交互的关键，以？开始。比如：http://www.baidu.com?item=a&color=b
frag：片段，也叫锚点。前面部分可以定位到具体某个资源文件，片段用来标识具体哪一个部分。而片段是不会发送给服务器的，服务器返回整个对象，浏览器根据片段来展示不同效果。

15、相对路径与绝对路径

详细：https://www.cnblogs.com/heyonggang/archive/2013/03/01/2938984.html

　　1.绝对路径

先说在本地计算机上，文件的绝对路径当然是指：文件在硬盘上真正存在的路径。

还有超链接文件位置，也属于绝对路径，例如http://www.img.net/img/icon.jpg 。

　　2.相对路径

相对路径，顾名思义就是自己相对与目标位置。

　　3.虚拟路径

将文件上传到远程服务器后，这些文件驻留在服务器本地目录树中的某一个文件夹中。

整理一下

“./” 代表当前目录 <img src="./img/icon.jpg" />等同于<img src="img/icon.jpg" />

“../” 代表上一级目录