课程试听
1-1 CSS使用介绍
- CSS是网页的美容师 免费试学
- CSS 初识 免费试学
- CSS体验语法规则 免费试学
- 语法补充及其常见错误 免费试学
1-2 font字体
- font-size字号设置 免费试学
- font-family字体设置 免费试学
- Unicode字体 免费试学
- font-weight字体加粗 免费试学
- font-style字体风格 免费试学
- font连写综合设定 免费试学
1-3 chrome开发者工具介绍
- chrome开发者工具 免费试学
1-4 选择器使用介绍
- 标签选择器 免费试学
- 体验类选择器 免费试学
- 类选择器练习Google案例 免费试学
- 类选择器常见错误及其命名规范 免费试学
- 多类名选择器(1) 免费试学
- 多类名选择器(2) 免费试学
- 体验ID选择器 免费试学
- 类选择器和id选择器区别 免费试学
- 通配符选择器 免费试学
1-5 CSS注释
- CSS注释 免费试学
1-6 CSS外观属性
- color颜色三种格式 免费试学
- line-height行高 免费试学
- 文字居中和首行缩进 免费试学
1-7 HTML标签语义化
- 标签的语义化(理论) 免费试学
1-8 综合案例
- 综合案例(一) 免费试学
- 综合案例(二) 免费试学
1-9 CSS选择器
- 交集选择器 免费试学
- 并集选择器 免费试学
- 后代选择器 免费试学
- 子元素选择器 免费试学
- 复合选择器测试题 免费试学
1-10 块级和行内元素
- 体验块级元素 免费试学
- 体验行内元素 免费试学
- 行内元素和和块级元素区别 免费试学
- 体验行内块元素 免费试学
- 三种显示模式转换 免费试学
- 链接伪类 免费试学
1-11 伪类和伪元素
- 元素伪类和focus
- 了解伪元素
- 简单导航小案例
1-12 行高
- 玩转行高(二)行高单位
- 玩转行高(一)
1-13 CSS样式表
- 行内样式表
- 内部样式表
- 外部样式表
- 样式表总结
- 导入式样式表
1-14 CSS三大特性
- CSS权重特殊性
- CSS继承性
- CSS层叠性
1-15 CSS权重练习
- a和h标题特殊性
- 6个经典权重练习题
1-16 背景图的介绍和使用
- 背景图片及其平铺
- 背景位置
- 背景简写
- 购物车案例
- 背景附着(背景固定)
- 英雄联盟背景做法
1-17 网页布局本质
- 看透网页布局的本质
1-18 盒模型
- 认识盒子模型
- 体会边框
1-19 表单和表格
- 表单边框清零
- 细线表格
1-20 轮廓线
- 轮廓线
1-21 active和focus的区别
- 链接的active和focus的区别
1-22 边框和内边距
- 边框详解分写
- padding的使用
- 新浪导航
1-23 外边距
- 让盒子居中对齐的原理
- 清除内外边距
- 外边距合并问题
1-24 盒模型练习题
- 盒子宽度以及简单计算题
- 中等数学题
- 计算题
1-25 搜索趣图案例
- 综合案例(搜索趣图)案例分析
- 综合案例(搜索趣图)(一)
- 综合案例(搜索趣图)(二)
- 综合案例(搜索趣图)(三)
1-26 盒子模型布局
- 盒子模型布局稳定性
1-27 普通流
- 普通流的定义
1-28 浮动使用介绍
- 体会浮动
- 浮动的由来和方向
- 浮动特性之包裹性
- 浮动特性之对齐
- 浮动特性之多个盒子一行显示需都浮动
- 浮动特性之脱标性
- 浮动特性之模式转换
- 浮动特性之显示位置
- 浮动总结--浮漏特
1-29 版心和布局流程详解
- 一列固定宽度切居中
- 版心和布局流程
- 左窄右宽型
- 通栏平均分布型
1-30 尚合网站整体部署
- 尚合网站准备工作
1-31 尚合网站logo和search
- logo和search结束
- logo和search实体化
1-32 尚合网站nav
- nav开始
- nav部分文字
- nav背景结束
1-33 尚合网站公告部分
- 公告部分开始
- 公告部分结束
1-34 尚合网站页面主体
- 页面主体三个盒子完成
- 页面主体部分h4公共部分完成
- 页面主体部分完成
- 页面主体新闻中心模块完成
1-35 尚合网站页面底部
- 页面底部开始
- 页面底部完成
1-36 清除浮动
- 为什么清除浮动
- 清除浮动其实更应该叫闭合浮动
- 清除浮动的本质
- 清除浮动之额外标签法
- 父级添加overflow清除浮动
- after伪元素
- 利用after伪元素清除浮动
- after伪元素空余字符法
- 双伪元素清除浮动
1-37 定位介绍
- 元素定位属性
- 为什么要用定位
1-38 静态定位
- 静态定位
1-39 相对和绝对定位
- 相对定位详解
- 父级没有定位子级以浏览器可视区对齐
- 父级有定位则以父级对齐
- 绝对定位不添加边偏移
- 子绝父相的由来
1-40 定位练习
- 定位练习
- 尚合网站添加定位
- 定位的盒子水平居中垂直居中
1-41 小米轮播图定位案例
- 小米轮播图(一)
- 小米轮播图(二)
1-42 固定定位使用介绍
- 固定定位
- 仿新浪固定头部和广告
1-43 定位总结
- 定位总结及其二维码
1-44 z-index
- 叠放层级zindex
1-45 定位模式转换
- 定位模式转换
1-46 visibility、display及overflow
- visibility和display
- 溢出overflow
1-47 鼠标样式
- 鼠标样式
1-48 轮廓和防止拖拽文本域
- 轮廓和防止拖拽文本域
1-49 vertical属性
- vertical垂直对齐
- vertical去除图片底测空白缝隙
1-50 css精灵图的使用介绍
- css精灵技术产生的背景
- css精灵技术的本质
- css精灵技术的使用
- css精灵技术拼出自己名字
- 制作css精灵图
- 鼠标经过更换精灵图片
1-51 阳光科技网站整体部署
- 阳光科技网站准备工作
1-52 网站顶部区域
- 顶部制作(一)
- 顶部制作(二)
1-53 网站header区域
- header制作(二)
- header制作(一)切片使用导出
1-54 阳光科技网站banner区域
- banner制作
1-55 网站主体区域
- 主体1info(一)
- 主体1info(二)
1-56 网站热线电话和下载模块
- 热线电话模块
- 下载模块
1-57 网站公司新闻区域
- 公司新闻(一)
- 公司新闻(二)
- 公司新闻(三)
1-58 网站footer区域
- footer底部(一)
- footer底部(二)
- footer底部(三)
1-59 阳光科技网站返回顶部
- 返回顶部
1-60 滑动门使用介绍
- 滑动门技术出现的原因
- 滑动门技术实现原理
- 滑动门技术代码实现
1-61 滑动门微信导航栏案例
- 微信导航栏(一)
- 微信导航栏(二)
1-62 CSS常用技巧
- margin负值运用
- css三角
- 代码完成音量键
- 给网站添加favicon图标
- logo优化
1-63 CSS文本属性
- 文本属性
- 文字超出以省略号替代
1-64 CSS兼容性
- CSS兼容性概述
- css属性hack
- css选择器hack
- css条件注释语法的使用
- css兼容性练习题
- 注意兼容性书写顺序
1-65 CSS常见Bug
- ie6双倍边距和最小高度问题
- ie6奇数引起bug
- ie67li里面多个浮动引起空白缝隙
- IE6撑开高度的特性