前端技术栈
JavaScript（行为）
CSS（样式）
HTML（内容）
通过网络协议与服务端连接
前端应该关注哪些方面
功能，美观，无障碍，安全，性能，兼容，体验
HTML(hypertext markup language,超文本标记语言)
完整的html代码例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题</title>
</head>
<body>
<h1>一级标题</h1>
<p>段落内容</p>
</body>
</html>
浏览器拿到html之后，会将html解析成一个dom树，把html文件解析成树形文件，每一个节点称为DOM节点，根节点为document，然后是html，再下去是head和body。
html语法
标签和属性不区分大小写，推荐小写
空标签可以不闭合，比如input、meta
属性值推荐用双引号包裹
某些属性值可以省略，比如required、readonly
标题h1~h6
将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推
标签hr在 HTML 页面中创建水平线。
hr 元素可用于分隔内容。
br标签用于换行
style属性
提供了一种改变所有HTML元素的样式的通用方法
background-color 属性为元素定义了背景颜色：
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸：
text-align 属性规定了元素中文本的水平对齐方式
文本格式化
b定义粗体文字
big定义大号字
em定义着重文字
i定义斜体字
small定义小号字
strong定义加重语气
sup，sub上下标
ins，del定义插入删除
code定义计算机代码
var定义变量
pre定义预格式文本
q定义短的引用语
blockquote定义长的引用
abbr定义缩写
注释
注释
<!-- This is a comment -->
链接
通过使用a标签在html中创建链接
有两种使用< a>标签的方式：
- 通过使用 href 属性 - 创建指向另一个文档的链接
- 通过使用 name 属性 - 创建文档内的书签
href 属性规定链接的目标。
开始标签和结束标签之间的文字被作为超级链接来显示。
"链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。
name 属性规定锚（anchor）的名称。
可以使用 name 属性创建 HTML 页面中的书签。
书签不会以任何特殊方式显示，它对读者是不可见的。
当使用命名锚（named anchors）时，我们可以创建直接跳至该命名锚（比如页面中某个小节）的链接，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。
将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到命名锚
图像
在 HTML 中，图像由< img>标签定义。
< img>是空标签，意思是说，它只包含属性，并且没有闭合标签。
要在页面上显示图像，你需要使用源属性（src）。src 指 "source"。源属性的值是图像的 URL 地址。
定义图像的语法是：
<img src="url" />
表格
表格由 < table> 标签来定义。每个表格均有若干行（由 < tr> 标签定义），每行被分割为若干单元格（由 < td> 标签定义）。字母 < td> 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
表格的表头使用 < th> 标签进行定义。
列表
列表（list）
有序列表（oi）
无序列表（ui）
定义列表（dd）
有序列表始于 < ol> 标签。每个列表项始于 < li> 标签
无序列表始于< ul> 标签。每个列表项始于 < li>标签
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 < dl> 标签开始。每个自定义列表项以< dt> 开始。每个自定义列表项的定义以 < dd> 开始。
HTML块
大多数 HTML 元素被定义为块级元素或内联元素。
编者注：“块级元素”译为 block level element，“内联元素”译为 inline element。
块级元素在浏览器显示时，通常会以新行来开始（和结束）。
例子：< h1>, < p>, < ul>, < table>
内联元素在显示时通常不会以新行开始。
例子：< b>, < td>, < a>, < mg>
< div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。
< div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
如果与 CSS 一同使用，< div> 元素可用于对大的内容块设置样式属性。
< div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 < table> 元素进行文档布局不是表格的正确用法。< table> 元素的作用是显示表格化的数据。
< span> 元素是内联元素(行内元素)，可用作文本的容器。< span> 元素也没有特定的含义。
当与 CSS 一同使用时，< span> 元素可用于为部分文本设置样式属性。
id
id 属性指定 HTML 元素的唯一 ID。 id 属性的值在 HTML 文档中必须是唯一的。
id 属性用于指向样式表中的特定样式声明。JavaScript 也可使用它来访问和操作拥有特定 ID 的元素。
id 的语法是：写一个井号 (#)，后跟一个 id 名称。然后，在花括号 {} 中定义 CSS 属性。
class的语法是：写一个.号 (.)，后跟一个 class 名称
HTML 书签用于让读者跳转至网页的特定部分。
如果页面很长，那么书签可能很有用。
要使用书签，您必须首先创建它，然后为它添加链接。
然后，当单击链接时，页面将滚动到带有书签的位置。
JavaScript 也可以使用 id 属性为特定元素执行某些任务。
JavaScript 可以使用 getElementById() 方法访问拥有特定 id 的元素：
文件路径
绝对文件路径是指向一个因特网文件的完整 URL
相对路径指向了相对于当前页面的文件:./当前文件夹，../上一级文件夹
