CSS揭秘

1. 缓动效果 给过渡和动画加上缓动效果（比如具有回弹效果的过渡过程） 回弹效果是指当一个过渡达到最终值时，往回倒一点，然后再次回到最终值，如此往复一次或多次，并逐渐收敛，最终稳定在最终值。 假设要用

1. 自适应内部元素的宽度max-width: min-content; 如果不给元素指定一个具体的 height，它就会自动适应其内容的高度。尝试对width 也实现类似的行为。 使 figure

1、 选用合适的鼠标光标——cursor：pointer 主要通过 cursor属性来指定光标类型 比如 pointer 光标可以提示某个元素是可点击的 而 help 光标用来暗示这里有提示信息。 某

1. 连字符断行——英文单词 英文文档下，实现英文单词的断行。 可以通过一些软连字符（­）来辅助浏览器进行断词 CSS属性 hyphens接受三个值：none、manual 和 auto 2.

1. 单侧投影 1.1 单侧投影 box-shadow 的第四个长度参数——扩张半径。它排在第三个参数模糊半径之后，这个扩张半径会根据你指定的值去扩大（当指定负值时）缩小投影的尺寸。举例来说，一个 -

1. 自适应的椭圆 给任何正方形元素设置一个足够大的 border-radius，就可以把它变成一个圆形 其中，如果指定任何大于 100px 的半径，仍然可以得到一个圆形 border-radius，

1. 半透明边框——background-clip: padding-box; 假设想给一个容器设置一层白色背景和一道半透明白色边框，body的背景会从它的半透明边框透上来。我们最开始的尝试可能是这样

1. 前期准备工作 1.1 一个工具函数——$$()——获取所有匹配特定 CSS 选择器的 DOM 元素 1.2 浏览器兼容性信息 有很多优秀的网站提供了及时有效的浏览器兼容性信息。推荐如下： Can