只用CSS能玩出什么样的花样？

如果你是一位css的初级玩家的话大概会以为css只是用来给HTML单纯的做静态样式的话，那你就错了。我在这里用了“初级玩家”这几个字是因为我个人对书写css非常有乐趣。没错大人认为css用来做样式是因为它的主要功能是这样，但我们能否给css做出点花样来呢。比如类似于js的一些效果来，答案是显而易见的 如果不行我也不用在这写这篇文章了。

如果我们想将css做出一些js才能做出的效果的话，首先我们要理解为什么我们认为js才能出效果呢。我们来分析一下网页效果的原理：

首先需要一个初始化的样式效果

其次需要对网页进行一个事件触发效果(简单讲就是后期添加样式的契机)

最后就是改变样式的出现效果

我们的js其实非常的弱它的主要作用是第二步触发事件（点击等操作） 然后再依靠css显示效果，但第二步这恰恰是css最薄弱的一块。不过大家注意了 我这里用的是薄弱 就是说css虽然不擅长做这些事 但不代表不可以。Css2和Css3提供了我们位数不多的可以在后天改变样式的伪类:hover 、:targer、 :checked。

以上3个是可以触发css改变样式的几个伪类 只要有这个点再去配合css3新增的过度效果与动画效果就可以做出非常炫酷的效果。以下我就来举个例子吧。

图上是一个小人通过动画效果可以自己运动 然而操作的话就是下面的按钮 我们可以通过:target 被锚点选择的元素调整当前动画时间来调整速度。

当然如果你们还想问我css到底能做出多少炫酷的效果，并且尝试找答案 而答案很简单 简单的很遗憾 就是思想 让css有着无限的花样。

文章来源：千锋HTML5

本文由【简媒】提供同步技术支持。用简媒，一键发布10 + 平台，秒级运营100 + 账号。