CSS实战运用技术课程
课程天数：2天
课程介绍
通过对前端所需知识，包含HTML、CSS、JavaScript，以及前沿的HTML5、CSS3 等的精讲和案例实战，帮助学员掌握快速掌握前端开发所需技能。培训实践与理论并重，通过理论讲解，实例分析，以及对前端开发关键技术的实操练习，从而帮助学员深刻理解前端开发技能。
课程收益
学习并了解前端历史及演进，业内最新的前端发展方向；
掌握Web前端开发所需的基础理论知识，包括W3C标准化、前端开发规范等；
掌握HTML及HTML5 语义化标签、常用标签属性；
掌握CSS及CSS3，可以根据产品需求完成PC及移动端网页的开发；
移动开发越来越受到企业的重视，带领学员掌握移动开发所需的HTML5、CSS3知识，并结合实际项目，掌握移动开发布局、适配和调试技巧，完成一个移动端网页的开发。
培训对象
本课程适合初中级网页设计爱好者；
希望使用web标准对网页进行重构的网页设计师；
对前端感兴趣，但是零基础的开发人员；
有一定HTML、CSS基础，希望系统学习Web前端技能；
有后端开发经验，在工作中有前端开发需求，希望可以系统了解Web前端知识，满足工作需求；
课程大纲
1、Web前端开发历史及趋势
• 什么是Web前端
• Web前端的工作职责
• Web前端的工作内容
• Web前端的发展历史
• Web前端的发展趋势
2、HTML基础
• 前端开发工具 visual studio code / Chrome 浏览器
• 标签、元素、注释
• 文本、超链接、图像
• 表格
• 列表
• 表单
3、HTML5
• HTML5介绍
• HTML5新增标签
• 表单元素
• 表单属性
• 语义元素
4、CSS基础
• 什么是CSS
• 使用CSS的优势
• 如何使用CSS
5、CSS语法和选择器
• CSS语法说明
• ID选择器
• Class选择器
• 伪类选择器
6、CSS 字体样式、边框、背景、图片详解
• 字体样式
• 边框
• 背景
• 图片
7、CSS布局及常用属性介绍及实操
• 盒模型介绍
• float布局
• fixed 布局
• 相对定位
• 绝对定位
• margin padding
• clear
• display
• z-index
• visibility
8、CSS响应式设计
• Viewport介绍
• 媒体查询
9、CSS3新增属性
• 边框
• 圆角
• 字体
• 多列布局
10、CSS3弹性盒模型
• 弹性盒模型介绍
• box布局使用
• flex
11、CSS3动画
• 渐变
• 转换
• 过渡
• 动画
12、CSS预编译
• CSS预编译机制
• Stylus的安装和使用
• Stylus基本用法
• CSS代码重用
13、Bootstrap
• 主流CSS框架介绍
• bootstrap介绍
• layout
• content
• component
14、Element
• 目前最流行的前端Vue框架Element介绍
• 组件的概念及介绍
• 通过24分栏，快速创建layout布局
• container布局容器
