前端 及 HTML

Web前端基础 学习笔记

一、前端介绍

1.1、web 1.0 时代网页制作

• 网页制作是 web1.0 时代的产物，那个时候的网页主要是静态网页

1.2、web 2.0 时代前端开发

• 这个时候，网页有静态网页和动态网页

1.3、前端

• 其主要包括三个方面：HTML 结构 、CSS样式 、 JavaScript行为
  （1）HTML 结构： 就是网页的基础、模型，就像是建房子时，房子的结构。
  （2）CSS 样式： 这是对房子的装修。
  （3）JavaScript 行为： 人能对房子所进行的一些操作，如 开灯 等。

---

二、HTML 介绍

2.1、HTML 基本概念

• HTML 是一种 超文本标记语言 (Hyper Text Markup Language)，是W3C组织推荐使用的一个国际标准，是一种用来制作超文本文档的简单标记语言。

那么什么是超文本标记语言？说这个之前，先说另一个 纯文本 。

纯文本语言： 电脑自动的记事本，它所用的就是纯文本语言。只能对字体进行一些简单的操作（更改字体，大小），不能设置颜色，不能添加图形图片等，相当复杂的功能。

超文本语言： 就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。比如 PPT ，Word 等等，具有丰富的操作。

HTML 标记语言： 它不是修改文字的样式，而是告诉浏览器文字的语义。就是能用标签告诉浏览器，这些是什么。（比如， <h1>标题</h1> 说明这是一个标题，<P>段落</P> 这是一个文本段落）

2.2、HTML 发展

2.3、HTML 特点

1. 只是标记语言而不是编程语言，所以直接由浏览器执行即可
2. 超文本文件
3. 大小写不敏感
4. html / htm 为后缀

---

三、编辑器 与 插件安装

3.1、前端编辑器介绍

3.2、Sublime下载安装

1. 下载链接：http://www.sublimetext.com/3
   下载Sublime Text3的安装包（以win10,64位操作系统为例）, 如果是其它系统请下载自己适合的版本安装程序。
   

2. 安装就是一直 Next（如果你是刚接触电脑的未来大佬，建议软件不要安装到 C盘），还是不懂的话可以百度

3. 可以选择中文
   

3.3、Sublime 插件安装

1. Ctrl + ~ 键打开命令行

2. 安装控制台命令：https://packagecontrol.io/installation#st3
   
   
   

3. Ctrl + ~ 键关闭命令行

4. Ctrl + Shift + P 键打开命令板——安装插件
   Install Package
   Emmet
   JsFormat
   SideBarEnhancements
   CssComb
   Autoprefixer
   
   然后，其他库的安装就复制名字安装第一个就好了（安装的时候左下脚有东西来回动的）

5. 可以查看已经安装了的库