CSS魔法

> @Susan7239874 > 后面看不到啊，天哪 扫码进入公众号之后，点 “目录” 菜单可以找到完整文章内容。 这篇文章写于好几年前，如今参考价值也有限，不用特别在意。

@myheartwillgoon 抱歉，书虽好，也不要传播盗版哦。

@iPonyo 谢谢，已修正。

> @flybbjcs70： > 内凹圆角有锯齿怎么解决？ 向浏览器厂商提 bug 吧……

我将在 [BXT 技术沙龙](https://github.com/baixing/BXT) 的第一期再讲一次《重拾 CSS 的乐趣》，错过 CSS Conf 的同学速速报名吧！

补充一下，虽然 CSS 工作组并没有采纳 “让 `border-radius` 接受负值以生成内凹圆角” 的提议，但 “背景与边框 Level 4” 草案还是通过一个新增的 `corner-shape` 属性扩展了 `border-radius` 的功能。 如果我们要得到一个内凹圆角，在未来很可能只需要这样写： ``` css border-radius: 20px; corner-shape: scoop; ``` 这个新增的属性还可以让我们得到方形或斜面的切角效果。虽然此时 `border-radius` 这个名字略有些怪异，但好歹解决了一个大痛点。

@smilingpoplar CSS 动画是在 CSS3 时代出现的，所以你需要一本涵盖 CSS3 的书。不过网上已经有很多不错的教程了，另外 [本届 CSS Conf](http://www.w3ctech.com/topic/1463) 上瓜瓜同学的演讲也是不错的学习资源。

@smilingpoplar 另外，[《CSS Secrets》](https://github.com/cssmagic/CSS-Secrets)这本书的第八章都是讲动画的，有很多高级技巧，值得推荐。

@idiotWu :+1: 谢谢分享！渐变的好处主要在于用一个伪元素自身就可以实现。

@YarenTang 如果有必要的话，可以尝试上面的网友提供的用边框实现的方案。