# 前端教学大纲 [toc] ## 1. 教学环境 | 工具/内容 | 描述 | | --------- | -------------------- | | 编辑器 | VSCODE | | 浏览器 | Chrome \| FireFox | | 教学内容 | HTML5/CSS3/JS/jQuery | --- ## 2. VSCODE - [官网下载](https://code.visualstudio.com/) - 推荐插件列表 | 名称 | 描述 | | ------------------------- | ---------------------------- | | Chinese Language ... | 中文简体语言包 | | HTML CSS Support | html,css 语言支持包 | | Live Server | 实时临测文件变化并刷新浏览器 | | Markdownlint | Markdown 语法检查器 | | Markdown Preview Enhanced | Markdown 文档实时预览 | | Prettier-Code formatter | 代码自动格式化 | | VS Color Picker | 拾色器 | - vscode 已内置 _Emmet_ 插件(一款可加速 html 代码生成的流行插件) - vscode 已支持文件路径的实时感知提示 --- ## 3. Chrome | FireFox | 浏览器 | 下载地址 | | -------------- | ------------------------------------------ | | Chrome (谷歌) | <https://www.google.cn/intl/zh-CN/chrome/> | | FireFox (火狐) | <http://www.firefox.com.cn/> | --- ## 4. 教学内容 | 知识点 | 描述 | | ---------- | --------------------------------------------- | | HTML5 | 基本常识 / 基本元素与属性 | | CSS3 | 选择器 / 基本元素样式 / 盒模型 | | Flex | 弹性布局与实战 | | Grid | 网格布局与实战 | | JavaScript | 数据类型 / 流程控制 / DOM / 事件 / Ajax / ... | | jQuery | DOM / 事件 / Ajax / ... |