01-学习路线及软件下载

目录

1. 什么是网页

2. 什么是HTML

3. Web 标准

3.1 Web标准的构成

3.2 为什么需要Web标准

4. 网页开发工具（及插件）

4.1 VSCode的下载及使用

4.1.1 VSCode基本使用

4.1.2 VSCode 插件安装

4.1.3 VSCode基本设置

5. 学习路线

1. 什么是网页

网页主要由文字、图像和超链接（超链接为单击可以跳转到 其他页面的元素）等元素构成。当然除了这些元素，网页中还可以包含音频、视频以及动画等。

我们上网时浏览新闻、查询信息、看视频等都是在浏览网页。

网页是构成网站的基本元素，通常我们看到的网页常见以.htm或.html后缀结尾的文件，因此将其俗称为HTML文件。

2. 什么是HTML

HTML指的是超文本标记语言（Hyper Text Markup Language)，它是用来描述网页的一种语言。HTML不是一种编程语言，而是一种标记语言，由标签组成的，如图片标签、链接标签、视频标签。

所谓超文本，有2层含义:
       1. 可以加入图片、声音、动画、多媒体等内容（超越了文本限制）。
       2. 它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本）。

3. Web 标准

3.1 Web标准的构成

Web标准并不是某一个标准，而是一系列标准的集合，主要包括结构、表现和行为三个方面。

3.2 为什么需要Web标准

为了兼容多个版本的浏览器，W3C与其他标准化组织共同制定了一系列的Web标准。

遵循Web标准除了可以让不同的开发人员写出更标准、更统一的页面标准外，还有以下优点：

1. 让Wｅｂ的发展前景更广阔       
2. 内容能被更广泛的设备访问       
3. 更容易被搜索引擎搜索       
4. 降低网站流量费用       
5. 使网站更易于维护       
6. 提高页面浏览速度

4. 网页开发工具（及插件）

4.1 VSCode的下载及使用

Visual Studio Code 下载

点击下载链接，下载适合的版本，直接点击安装即可。

4.1.1 VSCode基本使用

在电脑任意盘符下创建一个文件夹。打开VS Code，选择“文件→打开文件夹”选项，导入新建的文件夹作为项目的根目录，用于存放各类项目文件。

1. 双击软件打开软件，可以导入文件夹
2. 新建文件（Ctrl+N）
3. 保存(Ctrl+S), 注意后缀要保存为.html文件
4. Ctrl+加号键/减号键，可以放大缩小视图
5. 生成页面骨架结构，输入!按下Tab键。
6. 利用插件在浏览器中预览页面：单击鼠标右键，在弹出口中点击"Open In Default Browser"。

4.1.2 VSCode 插件安装

1. 打开VSCode，点击插件按钮；
2. 在拓展应用搜索所需要的插件；如Chinese，可以将VSCode变为中文版，不愁看不懂了。

3. 搜索完后点击安装按钮即可

"open in browser": 使你的代码能在不同的浏览器里预览，需装。

“会了吧”是一个能统计你写代码里面的英文。 
“Auto Rename Tag” 是一款能同时更改标签的开头和结尾，也可以等后面用的时候再安装     
"Live Server"： 安装了后写的效果能实时在网页中刷新，按Ctrl+S即刷新了，前题是使用Live Server运行的。     
“VSCode icons”: 创建的文件会根据类型给予不同的图标。

所有安装的插件可以停止使用，也可以打开。不安装的话就是没有这个功能而已。

4.1.3 VSCode基本设置

设置界面颜色

VS Code默认的界面为黑色背景，我们如果想要更换界面颜色，可以单击工具栏左下方的管理按钮进行设置。同时该设置按钮里还可以更改代码字号、字体等。

5. 学习路线