课程介绍:
本课程采用2+5模式, 前两天承接HTML+CSS, 使用字体图标、平面转换、动画等,丰富网页效果和呈现方式;后5天完成移动端和多端适配效果。课程采用闭环方式设计,每天课程都有完整的案例或项目
课程目录:
- 第1节 – 阶段课程介绍
- 第2节 – 今日课程介绍
- 第3节 – 字体图标-基本使用
- 第4节 – 字体图标-iconfont类
- 第5节 – 案例-购物车
- 第6节 – 07字体图标-svg-上传
- 第7节 – 平面转换-介绍
- 第8节 – 平面转换-位移
- 第9节 – 平面转换-位移-技巧
- 第10节 – 平面转换-定位盒子居中
- 第11节 – 案例-双开门-布局
- 第12节 – 案例-双开门-hover效果
- 第13节 – 平面转换旋转
- 第14节 – 平面转换-转换原点
- 第15节 – 平面转换-多重转换
- 第16节 – 平面转换-缩放
- 第17节 – 案例-缩放
- 第18节 – 案例-缩放-注意点-层叠性
- 第19节 – 渐变
- 第20节 – 案例-渐变
- 第21节 – 综合案例-华为-结构分析
- 第22节 – 综合案例-华为-mask
- 第23节 – 综合案例-华为-hover效果
- 第24节 – 今日课程介绍
- 第25节 – 空间转换-简介
- 第26节 – 空间转换-位移
- 第27节 – 空间转换-透视属性
- 第28节 – 空间转换-透视属性-原理
- 第29节 – 空间转换-rotateZ
- 第30节 – 空间转换-rotateX
- 第31节 – 空间转换-rotateY
- 第32节 – 空间转换-左手法则
- 第33节 – 空间转换-rotate3d-了解
- 第34节 – 空间转换-立体呈现
- 第35节 – 3d导航-结构分析
- 第36节 – 3d导航-搭建立方体
- 第37节 – 3d导航-hover
- 第38节 – 上午回顾
- 第39节 – 空间转换-缩放
- 第40节 – 动画-简介
- 第41节 – 动画-from..to
- 第42节 – 动画-百分比
- 第43节 – 动画-animation复合属性01
- 第44节 – 动画-animation复合属性02
- 第45节 – 动画-animation拆分写法
- 第46节 – 动画-逐帧动画-简介
- 第47节 – 动画-逐帧动画-实现
- 第48节 – 动画-多组动画
- 第49节 – 综合案例-走马灯
- 第50节 – 综合案例-全民出游-背景大图
- 第51节 – 综合案例-全民出游-云彩-布局
- 第52节 – 综合案例-全民出游-云彩-动画
- 第53节 – 考试题
- 第54节 – 课程介绍
- 第55节 – 课程知识介绍
- 第56节 – PC和移动网页不同点
- 第57节 – 谷歌模拟器
- 第58节 – 分辨率
- 第59节 – 代码参考分辨率-逻辑
- 第60节 – 视口
- 第61节 – 二倍图
- 第62节 – 百分比布局
- 第63节 – Flex-体验
- 第64节 – Flex-简介
- 第65节 – Flex-组成
- 第66节 – Flex-主轴对齐方式
- 第67节 – Flex-侧轴对齐方式
- 第68节 – Flex-单独控制某个盒子侧轴对齐方式
- 第69节 – Flex-弹性盒子尺寸特点
- 第70节 – Flex-弹性伸缩比
- 第71节 – 小兔鲜儿-确认订单-准备工作
- 第72节 – 小兔鲜儿-确认订单-整体布局
- 第73节 – 小兔鲜儿-确认订单-底部支付-布局
- 第74节 – 小兔鲜儿-确认订单-底部支付-左侧
- 第75节 – 小兔鲜儿-确认订单-底部支付-右侧
- 第76节 – 小兔鲜儿-确认订单-用户信息-整体布局
- 第77节 – 小兔鲜儿-确认订单-用户信息-内容布局
- 第78节 – 小兔鲜儿-确认订单-用户信息-文字内容
- 第79节 – 课程介绍
- 第80节 – 小兔鲜儿-商品-布局
- 第81节 – 小兔鲜儿-商品-数量
- 第82节 – 小兔鲜儿-商品-描述
- 第83节 – 小兔鲜儿-其他信息-布局
- 第84节 – 小兔鲜儿-其他信息-内容
- 第85节 – Flex-修改主轴方向
- 第86节 – Flex-主轴方向和对齐方式
- 第87节 – Flex-弹性盒子换行
- 第88节 – Flex-调整行对齐方式
- 第89节 – 小兔鲜儿-pc-项目介绍
- 第90节 – 小兔鲜儿-pc-背景
- 第91节 – 小兔鲜儿-pc-内容布局
- 第92节 – 小兔鲜儿-pc-账户概览-布局
- 第93节 – 小兔鲜儿-pc-账户概览-内容
- 第94节 – 小兔鲜儿-pc-账户概览-图片尺寸
- 第95节 – 小兔鲜儿-pc-公共面板-布局
- 第96节 – 小兔鲜儿-pc-公共面板-文字样式
- 第97节 – 小兔鲜儿-pc-订单-li布局
- 第98节 – 小兔鲜儿-pc-订单-内容布局
- 第99节 – 小兔鲜儿-pc-订单-goods
- 第100节 – 小兔鲜儿-pc-订单-goods-省略号
- 第101节 – 小兔鲜儿-pc-订单-common
- 第102节 – 移动适配
- 第103节 – 今日课程介绍
- 第104节 – 体验rem移动适配
- 第105节 – rem-基本使用
- 第106节 – rem-媒体查询
- 第107节 – rem-移动适配
- 第108节 – rem-布局流程
- 第109节 – rem-flexible移动适配
- 第110节 – Less-体验
- 第111节 – Less-简介
- 第112节 – Less-EasyLess插件
- 第113节 – Less-注释
- 第114节 – Less-计算
- 第115节 – Less-嵌套
- 第116节 – Less-变量
- 第117节 – Less-导入
- 第118节 – Less-导出-插件配置
- 第119节 – Less-导出-单独路径
- 第120节 – Less-禁止导出
- 第121节 – 游乐园-项目准备
- 第122节 – 游乐园-Less-导入
- 第123节 – 游乐园-整体布局
- 第124节 – 游乐园-根字号变量
- 第125节 – 游乐园-banner区域
- 第126节 – 游乐园-活动标题
- 第127节 – 游乐园-活动-布局
- 第128节 – 游乐园-活动-字体图标
- 第129节 – 游乐园-活动-状态-蓝色
- 第130节 – 游乐园-活动-状态-灰色
- 第131节 – 游乐园-活动-文字-top
- 第132节 – 游乐园-活动-文字-bottom
- 第133节 – 游乐园-活动-内容复制
- 第134节 – 游乐园-活动-底部工具栏
- 第135节 – vw-体验
- 第136节 – vh-体验
- 第137节 – vw-移动适配
- 第138节 – vh-移动适配
- 第139节 – vh-全面屏影响
- 第140节 – B站-获取素材
- 第141节 – B站-项目准备
- 第142节 – B站-头部-布局
- 第143节 – B站-vw变量
- 第144节 – B站-头部-logo图标
- 第145节 – B站-头部-right内容
- 第146节 – B站-头部-更多
- 第147节 – B站-头部-字体图标字号
- 第148节 – B站-头部-tab
- 第149节 – B站-视频-布局
- 第150节 – B站-视频-思路
- 第151节 – B站-视频-介绍文字
- 第152节 – B站-视频-数量统计
- 第153节 – B站-视频-弹性盒子换行
- 第154节 – B站-头部-层级和背景色
- 第155节 – 课程介绍
- 第156节 – 媒体查询-max-min-width
- 第157节 – 媒体查询-书写顺序
- 第158节 – 了解-媒体查询-完整写法
- 第159节 – 媒体查询-link写法
- 第160节 – 媒体查询-隐藏
- 第161节 – bootstrap-体验
- 第162节 – bootstrap-简介
- 第163节 – bootstrap-下载
- 第164节 – bootstrap-使用
- 第165节 – bootstrap-栅格系统-原理
- 第166节 – bootstrap-栅格系统-代码
- 第167节 – bootstrap-栅格系统-其他类名
- 第168节 – bootstrap-介绍
- 第169节 – bootstrap-表格
- 第170节 – bootstrap-按钮
- 第171节 – bootstrap-组件下载完整视频
- 第172节 – bootstrap-字体图标
- 第173节 – bootstrap-插件-下拉菜单
- 第174节 – bootstrap-插件-轮播图
- 第175节 – AlloyTeam-项目准备
- 第176节 – AlloyTeam-banner图-高度
- 第177节 – AlloyTeam-头部-组件
- 第178节 – AlloyTeam-头部-样式
- 第179节 – bootstrap-定制-项目导航
- 第180节 – AlloyTeam-开源项目-标题文字
- 第181节 – AlloyTeam-开源项目-栅格布局
- 第182节 – AlloyTeam-开源项目-内容
- 第183节 – bootstrap-全局样式
文件1地址点击下载
本站资料仅供个人学习和研究使用 若本帖作者内容侵犯了原著者的合法权益请提供相应证明材料本站审核通过后将即予以处理
评论0