当前位置:主页 > 书籍配套资源 > web前端配套资源
《CSS3艺术:网页设计案例实战》配套资源

《CSS3艺术:网页设计案例实战》配套资源

  • 更新:2021-04-30
  • 大小:1.47 GB
  • 类别:web前端
  • 作者:张偶
  • 出版:人民邮电出版社
  • 格式:PDF

  • 资源介绍
  • 相关推荐

编辑推荐

丰富案例.190个前端开发实例,在实战中了解CSS3艺术设计技巧
全彩印刷.关键代码+知识重难点一目了然,学习不单调不枯燥
扫码视频.作者细致拆解实例结构,引导读者快速上手
丰富资源.演示文件+常用色卡+海量更新资源,全方位提高读者实战技能

内容简介

本书以 CSS3 版本为平台,使用大量生动、美观的实例,系统地剖析了 CSS 与视觉效果相关的重要语法。全书分为13章,第1章回顾基础知识,第2章~第10章介绍了 CSS3 的伪元素,边框,背景, 阴影,剪切、滤镜和色彩混合,变量与计数器,变换、缓动、动画等在视觉展现方面的内容,第 11 章~第13 章探讨了 CSS3 在造型创意、动画创意和文字特效创意方面的设计思路。

作者简介

张偶,拥有Web开发近20年工作经验,现为互联网公司web开发主管。曾入选 SegmentFault 社区年度榜排名前3位,亦是 CodePe社区较受欢迎的国内开发者之一。近年来实践 PBL(project-based learning)学习方法,潜心研究 CSS 艺术设计,积累了大量心得体会。

目录

第 1 章 CSS 基础知识 n
1.1 CSS 简介 n
1.2 在页面中应用CSS n
1.2.1 内联样式 n
1.2.2 style 元素 n
1.2.3 link 标记 n
1.3 常用CSS 属性一览 n
1.4 选择器 n
1.4.1 标签选择器 n
1.4.2 类选择器 n
1.4.3 后代选择器 n
1.4.4 伪类选择器 n
1.5 单位 n
1.5.1 长度 n
1.5.2 颜色 n
1.6 盒模型 n
1.6.1 内边距、边框和外边距 n
1.6.2 box-sizing n
1.7 定位 n
1.7.1 相对定位 n
1.7.2 绝对定位 n
1.8 布局 n
1.8.1 flex 布局 n
1.8.2 grid 布局 n
1.9 重叠 n
1.9.1 元素之间的重叠关系 n
1.9.2 含有子元素的容器之间的重叠关系 n
1.9.3 主元素与子元素(伪元素)之间的重叠关系 n
1.10 继承和引用 n
1.10.1 继承 n
1.10.2 引用颜色 n
1.10.3 引用尺寸 n
n
第 2 章 伪元素 n
2.1 ::before 和::after 伪元素 n
2.2 content 属性 n
2.3 灵活使用伪元素 n
2.3.1 用伪元素拼接造型 n
2.3.2 用主元素和伪元素拼接造型 n
2.3.3 用伪元素表现造型的一部分 n
2.3.4 用主元素和伪元素表现造型的3 个部分 n
2.3.5 用伪元素表现成对的元素 n
2.4 项目应用 n
2.4.1 项目一:蒸锅 n
2.4.2 项目二:怪兽 n
第3 章 边框 n
3.1 边框属性 n
3.1.1 边框样式border-style n
3.1.2 边框宽度border-width n
3.1.3 边框颜色border-color n
3.1.4 分别设置每条边框 n
3.1.5 边框圆角border-radius n
3.1.6 轮廓线outline n
3.2 描边造型 n
3.2.1 同心正方形 n
3.2.2 同心圆 n
3.2.3 圆弧 n
3.3 几何造型 n
3.3.1 圆形 n
3.3.2 半圆形 n
3.3.3 扇形 n
3.3.4 三角形 n
3.3.5 组合的花形 n
3.4 项目应用 n
3.4.1 项目一:铅笔 n
3.4.2 项目二:宇宙飞船 n
第4 章 背景 n
4.1 背景属性 n
4.1.1 背景颜色background-color n
4.1.2 背景图片background-image n
4.1.3 背景位置backgroundposition
4.1.4 背景尺寸background-size n
4.1.5 背景平铺backgroundrepeat n
4.2 线性渐变linear-gradient() n
4.2.1 多个参数值 n
4.2.2 锐利的线性渐变 n
4.2.3 线性渐变的角度 n
4.2.4 有透明度的线性渐变 n
4.3 径向渐变radial-gradient() n
4.3.1 多个参数值 n
4.3.2 锐利的径向渐变 n
4.3.3 椭圆和正圆 n
4.3.4 有透明度的径向渐变 n
4.4 项目应用 n
4.4.1 项目一:熊猫 n
4.4.2 项目二:雷达扫描 n
第5 章 阴影 n
5.1 盒阴影box-shadow n
5.1.1 外部阴影 n
5.1.2 内部阴影 n
5.1.3 多重阴影 n
5.1.4 复制自身的阴影 n
5.2 形状阴影函数drop-shadow() n
5.3 项目应用 n
5.3.1 项目一:日历 n
5.3.2 项目二:飞机舷窗 n
第6 章 剪切、滤镜和色彩混合 n
6.1 剪切clip-path n
6.1.1 矩形剪切inset() n
6.1.2 圆形剪切circle() n
6.1.3 椭圆形剪切ellipse() n
6.1.4 多边形剪切polygon() n
6.2 滤镜filter n
6.2.1 透明度滤镜opacity() n
6.2.2 模糊滤镜blur() n
6.2.3 色相滤镜hue-rotate() n
6.2.4 亮度滤镜brightness() n
6.2.5 对比度滤镜contrast() n
6.2.6 多重滤镜 n
6.3 色彩混合 n
6.3.1 multiply 模式 n
6.3.2 scree模式 n
6.3.3 difference 模式 n
6.3.4 color-dodge 模式 n
6.4 项目应用 n
6.4.1 项目一:莲花 n
6.4.2 项目二:彭罗斯三角形 n
n
第7 章 变量与计数器 n
7.1 变量 n
7.1.1 声明和引用变量 n
7.1.2 表达式 n
7.1.3 批量描述一组元素的样式 n
7.2 计数器 n
7.2.1 计数器的声明、累加和读取 n
7.2.2 计数器初始值和步长 n
7.2.3 计数器的序列值 n
7.2.4 用计数器设计一个字母表 n
7.3 项目应用 n
7.3.1 项目一:监控眼 n
7.3.2 项目二:纸鹤 n
n
第8 章 变换 n
8.1 变换函数 n
8.1.1 平移函数translate() n
8.1.2 旋转函数rotate() n
8.1.3 缩放函数scale() n
8.1.4 扭曲函数skew() n
8.2 变换原点transform-origin
8.3 多重变换 n
8.4 项目应用 n
8.4.1 项目一:炫彩旋臂 n
8.4.2 项目二:两只鹦鹉 n
n
第9 章 缓动 n
9.1 缓动属性 n
9.1.1 持续时长transitionduration
9.1.2 延时启动时长transitiondelay n
9.1.3 参与缓动的属性transitionproperty n
9.1.4 时间函数transition-timingfunction
9.2 设置恢复效果 n
9.3 令一组元素缓动 n
9.4 对元素的不同状态进行交互设计 n
9.4.1 获得焦点:focus n
9.4.2 选择选项:checked n
9.4.3 页内跳转:target n
9.5 项目应用 n
9.5.1 项目一:彩虹 n
9.5.2 项目二:两颗爱心 n
第 10 章 动画 n
10.1 动画属性 n
10.1.1 语法结构 n
10.1.2 持续时长animationduration
10.1.3 延时启动时长animationdelay n
10.1.4 时间函数animation-timingfunction
10.1.5 播放次数animation-iterationcount n
10.1.6 变化方向animationdirection
10.1.7 填充模式animation-fillmode n
10.1.8 播放状态animation-playstate n
10.1.9 多个动画效果叠加 n
10.2 关键帧@keyframes n
10.2.1 from...to... 关键帧 n
10.2.2 百分比关键帧 n
10.2.3 循环效果 n
10.2.4 静止效果 n
10.2.5 关键帧的缺点 n
10.3 不同属性的动画效果 n
10.3.1 边框动画 n
10.3.2 背景动画 n
10.3.3 阴影动画 n
10.3.4 剪切动画 n
10.3.5 变换动画 n
10.4 项目应用 n
10.4.1 项目一:乒乓球对打 n
10.4.2 项目二:徘徊的果冻怪兽 n
第 11 章 CSS 造型创意 n
11.1 螺旋形状的盘式蚊香 n
11.2 倒圆锥形状的热气球 n
11.3 逼真金属质感的笔记本电脑 n
11.4 用典型特征塑造的卓别林形象 n
第 12 章 CSS 动画创意 n
12.1 层叠起伏的海浪 n
12.2 天体运转模型 n
12.3 充满秩序美的队列变色旋转动画 n
12.4 几何光学引起的咖啡馆墙壁错觉动画 n
第 13 章 文字特效创意 n
13.1 撕纸文字 n
13.2 牛奶文字 n
13.3 闪光的霓虹文字 n
13.4 立体的阶梯文字 n
附录 CSS 色彩名称对照表

资源下载

资源下载地址1:https://box.lenovo.com/l/9514VH

相关资源

网友留言