1 代码编辑器

WebStorm 万能
VSCode 常用
HbuilderX 
Sublime Text
Atom
Brackets
NodePad++
EditPlus
Vim
Dreamweaver

2 浏览器

主流浏览器：Chrome、IE、FireFox、Safari、Opera，代表着五种内核
其他浏览器：360安全浏览器、360极速浏览器、搜狗浏览器、UC浏览器、猎豹浏览器、夸克浏览器、海豚浏览器、傲游浏览器、QQ浏览器、2345浏览器 等
现在的浏览器基本都采用Chrome的内核webkit,也有双核浏览器

3 HTML

3.1 HTML文件

HTML是超文本标记语言，HTML文件使用代码编辑器编辑代码，使用浏览器查看网页。

3.2 文档声明

作用：告诉浏览器用标准模式渲染网页

3.3 HTML标签

• HTML的基本组成部分
• 最重要的是标签的语义，决定标签在什么地方使用
• 有的标签有属性，有的标签没有
• 有单标签和双标签，其中单标签中的 ” / ” 可省略，如
  

  ---

  等同于

  ---

3.3.1 标签的属性

• 给标签设置属性：

标签名>
标签名>
标签名>

• 一个标签可以设置多个属性，用空格隔开：

标签名>

• 同一个属性不要设置多次，否则会默认第一个属性，后面的属性无效
• 标签不区分大小写
• 每个标签有不同的属性，如：font 标签有color属性，而 h1 标签没有color属性

3.3.2 如何掌握一个标签

• 标签的语义：决定标签用在什么地方
• 标签的属性，以及属性的值如何设置
• 标签是单标签还是双标签

3.3.3 HTML标签总结

3.3.3.1 主体结构标签

标签名	语义和功能	属性	单标签or双标签
html	网页根标签		双标签
head	页面头部标签		双标签
body	页面主体内容标签		双标签

3.3.3.2 head中的标签

标签名	语义和功能	属性	单标签or双标签
title	页面标题（标题栏标题）		双标签
meta	设置网页元信息	charset：设置字符集编码，utf-8、gbk、gb2312 等	单标签

3.3.3.3 格式排版标签

标签名	语义和功能	属性	单标签or双标签
h1~h6	标题（一级~六级，越来越小）		双标签
p	段落		双标签
hr	分隔符		单标签
br	换行		单标签
pre	原样显示标签，可以显示缩进，可以用于页面中显示代码（但不能直接显示html代码，需要用&lt和&gt表示””才能显示）		双标签
div	无语义，广泛用于页面布局，div中可以嵌套很多标签		双标签

3.4 HTML注释

可注释一行或多行，注释的作用：

• 对代码进行解释和说明
• 临时注释用于调试代码

3.5 基本页面模板

基本每一个页面的代码都会有以下内容：

    
        
        

        这里是网页的主体内容
    

• 字符集编码是为了将用户输入的语言转换为数字编码，这样计算机可以将数字编码转换为二进制语言进行相应的操作，避免了乱码问题。
• 区分网页标题和标题：网页标题是head中的内容，显示在浏览器的标题栏；标题是body中的内容，显示在浏览器的页面内容中。