扫描二维码学会掌握：
适合人群：
- 第1章： HTML/CSS基础[01.必要基础]
- 1.1：请加入本课程学习社群
- 1.2：【很重要】
- 1.3：如果您实际开发的场景与教程中的场景不一样,出现问题,可以免费申请教程补录,完全免费,扫码加群,联系客服即可
- 1.4：什么是HTML&CSS
- 1.5：VS Code的下载与安装
- 1.6：初始化、语义化HTML、第一个HTML页面
- 1.7：常用HTML标签概览
- 1.8：初识CSS与引用的方法
- 1.9：CSS基础语法与选择器 [1]
- 1.10：CSS基础语法与选择器 [2]
- 1.11：CSS继承
- 1.12：CSS权重
- 1.13：盒子模型
- 1.14：CSS块级元素[block]与行内元素[inline]
- 1.15：浮动[Float]
- 1.16：绝对定位[position]
- 1.17：背景[background]
- 1.18：文字方向[text-align]
- 1.19：总结
- 第2章： HTML/CSS基础[02.基础切图]
- 2.1：初始化CSS
- 2.2：head之LOGO的实现
- 2.3：head之菜单的实现
- 2.4：HTML与CSS书写规范
- 2.5：banner图的实现
- 2.6：首页标题块[index-title]
- 2.7：nth-child简介
- 2.8：首页第一个块[1]布局与nth-child应用
- 2.9：首页第一个块[2]background-position的应用
- 2.10：首页第一个块[3]ul与li标签的应用
- 2.11：首页第一个块[4]list-style-image的应用
- 2.12：首页通用按钮的制作
- 2.13：首页第二个块[1]background与background-size
- 2.14：首页第三个块-代码重用初识
- 2.15：首页第四个块的完成
- 2.16：初识border-radius
- 2.17：border-radius的应用
- 2.18：overflow的认识
- 2.19：box-shadow的初识
- 2.20：box-shadow的应用
- 2.21：swiper插件的初识与应用
- 2.22：字体图标的使用方法
- 2.23：全局右侧tool小工具的实现 [1]
- 2.24：全局右侧tool小工具的实现 [2]
- 2.25：小技巧-到页面任何位置
- 2.26：伪类hover进阶 - 下拉菜单 [1]
- 2.27：伪类hover进阶 - 下拉菜单 [2]
- 第3章： HTML/CSS进阶[01]企业站&PC&移动
- 3.1：摘要
- 3.2：初始化代码
- 3.3：首页head [1] 引入swiper
- 3.4：首页head [2] swiper指示器的修改
- 3.5：首页head [3] 幻灯片完成
- 3.6：首页head [4] nav菜单制作完成
- 3.7：首页head [5] text-shadow文字阴影的应用
- 3.8：首页info块 [1]
- 3.9：首页info块 [2] nth-child逻辑问题剖析
- 3.10：首页公用标题title
- 3.11：JQuery懒加载插件[lazyload]的使用
- 3.12：首页News新闻块的布局
- 3.13：首页News块完成 [超出几行显示省略号功能实现]
- 3.14：首页1-3[1]布局
- 3.15：首页1-3[2]布局块left完成 透明背景的应用
- 3.16：首页1-3[3]布局块right完成
- 3.17：首页多栏新闻块完成 CSS代码的重用
- 3.18：首页案例块[1]布局
- 3.19：首页案例块[2]swiper应用
- 3.20：首页案例2的完成
- 3.21：footer完成
- 3.22：基于Jq的下拉菜单 [1]
- 3.23：基于Jq的下拉菜单 [2]
- 3.24：新闻列表页的实现 [1]
- 3.25：新闻列表页的完成 [2]
- 3.26：图片列表的完成 代码Copy
- 3.27：作业布置
- 3.28：本地环境搭建与手机访问电脑本地网站
- 3.29：手机访问电脑网页自动跳转至移动端网页
- 3.30：初始化CSS与引用font.css
- 3.31：尾部菜单的完成
- 3.32：head-logo块的完成
- 3.33：swiper插件的引用与调试
- 3.34：二级菜单的设计与制作 [1]
- 3.35：二级菜单的设计与制作 [2] 美化二级菜单
- 3.36：首页新闻列表的制作
- 3.37：图片懒加载的应用
- 3.38：仿APP左滑动过渡效果的应用
- 3.39：服务页面的搭建与left-loading的优化
- 3.40：服务页面的完成与[课后作业]
- 3.41：transition过渡属性的使用
- 3.42：CSS3预设动画库Animate的使用
- 3.43：总结
- 第4章： HTML/CSS进阶[02]大型门户站&PC&移动
- 4.1：简介
- 4.2：全局初始化
- 4.3：top块 [1] 布局
- 4.4：top块 [2] 细节完成
- 4.5：logo块的完成
- 4.6：一级菜单的制作完成
- 4.7：二级菜单 [1] 布局
- 4.8：二级菜单 [2] 完成
- 4.9：首页顶部广告的完成
- 4.10：首页第一个块 [1] 布局
- 4.11：首页第一个块 [1] 左块 [1]
- 4.12：首页第一个块 [1] 左块 [2]
- 4.13：首页第一个块 [2] 中块 [1] 幻灯片组件
- 4.14：首页第一个块 [2] 中块 [2] 幻灯片组件调整完成
- 4.15：首页第一个块 [3] 右块 完成
- 4.16：首页第二个块 [1] 布局
- 4.17：首页第二个块 [2] 左块广告处
- 4.18：首页第二个块 [3] 左块完成
- 4.19：首页第二个块 [4] 中块顶部标题
- 4.20：首页第二个块 [5] 中块下部文章列表
- 4.21：首页第二个块 [6] 重新加一个布局
- 4.22：首页第二个块 [7] 填充一个新的块
- 4.23：首页第二个块 [8] 全部完成
- 4.24：首页第二个广告块的完成
- 4.25：首页for通用块 [1] 布局
- 4.26：首页for通用块 [2] 左侧幻灯片的实现
- 4.27：首页for通用块 [3] 大标题的实现
- 4.28：首页for通用块 [4] 中栏上半部分
- 4.29：首页for通用块 [5] 中栏的完成
- 4.30：首页for通用块 [6] 全部完成
- 4.31：首页第三个广告块的完成
- 4.32：SuperSlide插件的学习与使用
- 4.33：首页TAB切换卡 块 [1] 大标题的完成
- 4.34：首页TAB切换卡 块 [2] 基础内容与样式的实现
- 4.35：首页TAB切换卡 块 [3] 基于SuperSlide插件的切换卡实现
- 4.36：首页复杂块 [1] 标题与布局
- 4.37：首页复杂块 [2] 左侧幻灯片的完成
- 4.38：首页复杂块 [3] 左侧全部完成
- 4.39：首页复杂块 [4] 中间块的布局
- 4.40：首页复杂块 [5] 中间块的全部完成
- 4.41：首页复杂块 [6] 右侧块 TAB 切换卡 [1]
- 4.42：首页复杂块 [7] 右侧块 TAB 切换卡 [2]
- 4.43：首页复杂块 [8] 右侧块 TAB 切换卡 [3] 完成
- 4.44：首页复杂块 [9] 全部完成
- 4.45：首页 不规则图片布局 [1] 左侧布局完成
- 4.46：首页 不规则图片布局 [2] 右侧布局完成
- 4.47：首页 友情链接的完成
- 4.48：全局 尾部footer [1] 上半部分
- 4.49：全局 尾部footer [2] 全部完成
- 4.50：HTML&CSS代码压缩
- 4.51：PC端首页的总结
- 4.52：移动端-初始化代码
- 4.53：移动端-全局尾部菜单 [完成]
- 4.54：移动端-最顶部导航的完成 [完成]
- 4.55：移动端-首页幻灯片的完成 [完成]
- 4.56：移动端-首页二级菜单 [完成] [1]
- 4.57：移动端-首页二级菜单 [完成] [2]
- 4.58：移动端-首页三级菜单 [完成]
- 4.59：移动端-首页列表标题 [完成]
- 4.60：移动端-首页列表 [1] 出现问题 [小思考]
- 4.61：移动端-首页列表 [2] 第一种解决方法
- 4.62：移动端-首页列表 [3] 第二种解决方法CSS函数calc的使用
- 4.63：移动端-页面补齐
- 4.64：移动端-overflow-auto的应用
- 4.65：结尾
- 4.66：小技巧[1]外部CSS与JS不缓存
- 第5章： HTML5/CSS3常用的新特性
- 5.1：摘要简介
- 5.2：媒体查询 [1] 外链样式(max-width)
- 5.3：媒体查询 [2] 外链样式(min-width)
- 5.4：媒体查询 [3] 页内写法
- 5.5：媒体查询 [4] 当页面大于x小于x时应用的css
- 5.6：媒体查询 [5] 简单的实战
- 5.7：CSS选择器的知识扩展
- 5.8：CSS3动画 [1] 旋转
- 5.9：CSS3动画 [2] 变形
- 5.10：CSS3动画 [3] 缩放
- 5.11：CSS3动画 [4] 位移
- 5.12：CSS3动画 [5] 矩阵
- 5.13：CSS3动画 [6] 中心点
- 5.14：CSS3动画 [1] 入门及使用方法
- 5.15：CSS3动画 [2] 各个属性分开写
- 5.16：CSS3动画 dome 剖析 [1] 从右至左的滑动效果
- 5.17：CSS3动画 dome 剖析 [2] 炫酷背景效果
- 5.18：Flex弹性布局 - 初识
- 5.19：Flex弹性布局-父元素[1]flex-direction属性
- 5.20：Flex弹性布局-父元素[2]flex-wrap属性
- 5.21：Flex弹性布局-父元素[3]justify-content属性
- 5.22：Flex弹性布局-父元素[4]align-items属性
- 5.23：Flex弹性布局-父元素[5]align-content属性
- 5.24：Flex弹性布局-子元素[1]order属性
- 5.25：Flex弹性布局-子元素[2]flex-grow属性
- 5.26：Flex弹性布局-子元素[3]align-self属性
- 5.27：Grid网格布局 - 简介
- 5.28：Grid网格布局 - 概念
- 5.29：Grid网格布局 - [1] 申明为Grid网格布局
- 5.30：Grid网格布局 - [2] 行与列的申明
- 5.31：Grid网格布局 - [3] 容器属性[repeat]auto-fill函数申明
- 5.32：Grid网格布局 - [4] 容器属性fr单位
- 5.33：Grid网格布局 - [5] 容器属性minmax
- 5.34：Grid网格布局 - [6] 容器属性auto
- 5.35：Grid网格布局 - [7] 容器属性grid-gap
- 5.36：Grid网格布局 - [8] 容器属性grid-auto-flow
- 5.37：Grid网格布局 - [9] 容器属性justify-items
- 5.38：Grid网格布局 - [10] 容器属性justify-content
- 5.39：[完]
- 第6章： Sass & 最强大的专业级CSS扩展语言 & CSS预处理
- 6.1：Scss课程介绍
- 6.2：[1]什么是sass
- 6.3：[2]sass和scss的区别
- 6.4：[3]sass的强大之处演示
- 6.5：[1]如何在VSCode中使用sass[添加插件live Sass Compiler]
- 6.6：[2]如何在VSCode中使用sass[配置插件]
- 6.7：sass常用功能[1]sass中的注释
- 6.8：sass常用功能[2]利用嵌套提升编码效率
- 6.9：sass常用功能[3]如何在嵌套中查找父选择器
- 6.10：sass常用功能[4]属性如何嵌套
- 6.11：sass常用功能[5]利用变量提升维护效率
- 6.12：sass常用功能[6]sass中的运算[1]减加乘
- 6.13：sass常用功能[6]sass中的运算[2]除法运算
- 6.14：sass常用功能[6]sass中的运算[3]变量运算
- 6.15：sass常用功能[6]sass中的运算[4]字符串运算
- 6.16：sass常用功能[7]灵活的差值语句
- 6.17：sass常用功能[8]利用@import实现模块化开发[1]结构拆分以及样式书写
- 6.18：sass常用功能[8]利用@import实现模块化开发[2]利用@import引入
- 6.19：sass常用功能[9]如何只编译指定的scss文件
- 6.20：sass常用功能[10]sass中的继承（@extend）
- 6.21：sass常用功能[11]占位选择器
- 6.22：sass常用功能[12]sass中的混合（@mixin）[1]混合的简单使用
- 6.23：sass常用功能[12]sass中的混合（@mixin）[2]带有默认值的参数以及多个参数
- 6.24：sass常用功能[12]sass中的混合（@mixin）[3]这部分内容更改的解释
- 6.25：sass常用功能[13]sass中的if判断（@if）[1]@if
- 6.26：sass常用功能[13]sass中的if判断（@if）[2]@else if
- 6.27：sass常用功能[14]sass中的for循环（@for）[1]through
- 6.28：sass常用功能[14]sass中的for循环（@for）[2]to
- 6.29：sass常用功能[15]sass中的@each
- 6.30：sass常用功能[16]sass中的函数
- 6.31：sass常用功能[17]一个小例子
- 6.32：课程总结
讲师介绍
学员提问
-
鲸鱼2021-08-10 -
吴立涛2020-10-20 -
李海洋2020-08-12 -
YYY2020-02-28
-
莫湘兆2020-02-17 -
龙起2020-02-17 -
小小2020-01-02
179,573人次学习
