CSS 揭秘 PDF 文档
本书是一本注重实践的教程,作者为我们揭示了 47 个鲜为人知的 CSS 技巧,主要内容包括背景与边框、形状、视觉效果、字体排印、用户体验、结构与布局、过渡与动画等。本书将带领读者循序渐进地探寻更优雅的解决方案,攻克每天都会遇到的各种网页样式难题。
本书的读者对象为前端工程师、网页开发人员。
在过去的几年里,CSS 经历了一场巨变,正如 JavaScript 在 2004 年前后所经历的那场革命。它从一门极度简单、功能有限的样式语言,发展成为一项由 80 多项 W3C 规范(含草案)所定义的复杂技术,并建立起了独有的开发者生态圈、专属的技术会议、专用的框架和工具链。
CSS 已经如此壮大,以致于一个普通人已经无法把它完整地装进自己的头脑了。甚至在 W3C 专门定义这门语言的工作组中,也没人敢说自己是精通 CSS 所有方面的专家,甚至连接近这个程度都非常困难。实际上,大多数工作组成员只专注 CSS 的某个特定细节,可能对其他部分知之甚少。
封面
数字版权声明
作译者介绍
扉页
版权
版权声明
本书赞誉
目录
译者序
序
前言
致谢
本书是怎样炼成的
关于本书
第1章 引言
Web标准:是敌还是友
标准的制定过程
CSS3、CSS4以及其他传说
冰与火之歌:浏览器前缀
CSS编码技巧
尽量减少代码重复
相信你的眼睛,而不是数字
关于响应式网页设计
合理使用简写
我应该使用预处理器吗
第2章 背景与边框
1 半透明边框
难题
解决方案
2 多重边框
难题
box-shadow方案
outline方案
3 灵活的背景定位
难题
background-position的扩展语法方案
background-origin方案
calc()方案
4 边框内圆角
难题
解决方案
5 条纹背景
难题
解决方案
垂直条纹
斜向条纹
更好的斜向条纹
灵活的同色系条纹
6 复杂的背景图案
难题
网格
波点
棋盘
7 伪随机背景
难题
解决方案
8 连续的图像边框
难题
解决方案
第3章 形状
9 自适应的椭圆
难题
解决方案
半椭圆
四分之一椭圆
10 平行四边形
难题
嵌套元素方案
伪元素方案
11 菱形图片
难题
基于变形的方案
裁切路径方案
12 切角效果
难题
解决方案
弧形切角
内联SVG与border-image方案
裁切路径方案
13 梯形标签页
难题
解决方案
14 简单的饼图
难题
基于transform的解决方案
SVG解决方案
第4章 视觉效果
15 单侧投影
难题
单侧投影
邻边投影
双侧投影
16 不规则投影
难题
解决方案
17 染色效果
难题
基于滤镜的方案
基于混合模式的方案
18 毛玻璃效果
难题
解决方案
19 折角效果
难题
45°折角的解决方案
其他角度的解决方案
第5章 字体排印
20 连字符断行
难题
解决方案
21 插入换行
难题
解决方案
22 文本行的斑马条纹
难题
解决方案
难题
23 调整tab的宽度
解决方案
24 连字
难题
解决方案
25 华丽的&符号
难题
解决方案
26 自定义下划线
难题
解决方案
27 现实中的文字效果
难题
凸版印刷效果
空心字效果
文字外发光效果
文字凸起效果
28 环形文字
难题
解决方案
第6章 用户体验
29 选用合适的鼠标光标
难题
解决方案
30 扩大可点击区域
难题
解决方案
31 自定义复选框
难题
解决方案
开关式按钮
32 通过阴影来弱化背景
难题
伪元素方案
box-shadow方案
backdrop方案
33 通过模糊来弱化背景
6.5.1 难题
解决方案
34 滚动提示
难题
解决方案
35 交互式的图片对比控件
难题
CSS resize方案
范围输入控件方案
第7章 结构与布局
36 自适应内部元素
难题
解决方案
37 精确控制表格列宽
难题
解决方案
38 根据兄弟元素的数量来设置样式
难题
解决方案
根据兄弟元素的数量范围来匹配元素
39 满幅的背景,定宽的内容
难题
解决方案
40 垂直居中
难题
基于绝对定位的解决方案
基于视口单位的解决方案
基于Flexbox的解决方案
41 紧贴底部的页脚
难题
固定高度的解决方案
更灵活的解决方案
第8章 过渡与动画
42 缓动效果
难题
弹跳动画
弹性过渡
43 逐帧动画
难题
解决方案
44 闪烁效果
难题
解决方案
45 打字动画
难题
解决方案
46 状态平滑的动画
难题
解决方案
47 沿环形路径平移的动画
难题
需要两个元素的解决方案
单个元素的解决方案
按规范分类
关注图灵
看完了
下载地址:https://www.wenjiangs.com/wp-content/uploads/staticcdn/pdf/47174a29-8e7f93d1.zip
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论