web培训课课程计划
第一周:
第一次课:
1、各种介绍:
自我介绍
课程介绍
合作伙伴介绍2、学web能干什么:
工程师
前端工程师
后端工程师
UI设计师微信
小程序
小游戏
公共号web
Web应用
Web游戏
安卓
IOS
物联网人工智能AI
Node-JS后端3、IT世界的常识
web
什么是前端/后端
什么是服务器
什么是接口4、网络工程与信息安全
HTTP与网络传输
通信原理
通信过程网络信息安全
信息泄露
欺骗
分布式攻击5、什么是开源软件
Git Hub
框架与库
996.ICU
第二次课:
1、网页结构
网页的格式HTML
HTML概念
Hello World使用text创建一个HTML
Hello World真实的网页
标签网页标签<h1>
网页标签规范html,head,body
2、编译器
为什么要用编辑器
展示几款编辑器HBuilder-X
安装教程使用方法
3、基础标签
html
head
title
body
h1-h5
p
em
br
b
<!—->4、表格与列表
标签嵌套
列表ul
li
ol表格
table
th
tr
td5、标签属性
a
href
img
src
height
widthvideo
input
第二周:
第一次课:
1、style属性与css
元素的style属性
css
样式表
style标签
基础语法2、css选择器
标签选择
class选择
id选择
属性选择3、css样式
css单位
PX
%
emcss尺寸
width
heightcss色彩格式
rgb
rgba
16进制背景
background-color
文字
text-align
color
font-size
font-family
text-indent
word-spacing4、外部样式
link标签
只能放在head里
href属性
type属性
rel属性css文件
路径相对路径
绝对路径浏览器缓存机制
5、css高级语法
auto
高级选择器组选择器
通配符
组合选择器
更复杂的选择器有趣的属性
opacity
border-radius
box-shadow
第二次课:
1、框模型div
css框模型
div标签
padding
borderstyle
colormargin
2、css定位
position属性
static
relative
absolute
fixed相对定位relative
top
bottom
left
right绝对定位absolute
top
bottom
left
right3、css浮动
float属性
排列布局
4、css布局
display属性
none
blockflex布局
flex-direction
flex-wrap
flex-flow
justify-content
align-items
align-content5、高级部分
块级标签与行内标签
span标签
inline
inline-block外边距合并特性
box-sizing
更高级的gird布局太难了讲不了
第三周:
第一次课:
1、css3
svg
css3概念
历史css3新特性
选择器
框模型
背景和边框
文本效果
2D/3D 转换
动画2、动画
@keyframes
animation
from
to
0%-100%3、伪类伪元素
元素的状态
鼠标悬浮状态
点击状态伪类
:hover
伪元素
:before
:after
content属性伪元素选择器
:first-child
:last-child
:nth-child()
:nth-last-child()4、网页自适应
meta标签
viewport
不用绝对宽度
流体布局
不用绝对字体大小
em
rem选择加载CSS
link的media属性
@media screen
手动自适应矫正
5、javascript
编程语言
动态修改网页document.getElementById
第二次课:
项目实战
网页制作
域名解析
网站部署
框架与库