CSS3转换点击事件

我想在css3转换中为div标签实现一个click事件。我希望它像一个正常的按钮点击事件。但我还是找不到一个办法。请任何人帮我一下。

您有两个基本选择：

• 在CSS中使用伪类

  ：active

  。单击时，元素将转换为

  ：active

  状态（假设为锚定）。虽然如果您需要广泛的浏览器覆盖范围（即：旧浏览器不支持），这不一定是最佳选择，但它是纯CSS实现的唯一选项

• 使用JavaScript。使用JavaScript，您可以在单击时切换元素的类，这将允许您更改元素的外观（包括在其上设置的任何转换）。比如：

  $('.selector').click(function(e){
      $(this).toggleClass('new-class');
      e.preventDefault();
  });
  

还有第三个非常棘手的选项，它涉及使用同级表单输入（复选框）并继承它的

checked

状态，但这可能不是您想要的

---

为了子孙后代的利益，这里有一把小提琴演示了我（从）所说的内容：

根据CSS3转换：

div
{
    transition-property: width;
    transition-duration: 1s;
    transition-timing-function: linear;
    transition-delay: 2s;
}

转换属性

：指定应用转换的CSS属性的名称

转换持续时间

：定义转换所需的时间长度。默认值为0

过渡正时功能

：描述如何计算过渡期间的速度。默认“轻松”

转换延迟

：定义转换何时开始。默认值为0

还有一个属性要使用所有其他属性：

转换

：用于将四个转换属性设置为单个属性的速记属性

或如果要使用普通css伪类：

button { }
button:hover { background-color: lime; }
button:active { background-color: fuchsia; }
button:focus { background-color: yellow; }

鉴于此html：

<button>Click me!</button>

：鼠标悬停在元素上方时为悬停

：单击（并按住）元素时处于活动状态

：焦点
是指当您用tab键指向元素时

希望有帮助
 他要求CSS，没有jquery…你已经有一点html和CSS了吗？JSFIDLE或类似的东西您不能使用CSS执行DOM操作。。对单击事件使用javascript或jquery。在这个点击事件中，添加一个类来保存css转换。使用javascript来处理点击事件可以吗？虽然有一些聪明的CSS技巧可以处理点击事件，但它们非常粗糙且特定于浏览器。@Hendrik是的，使用JS处理点击事件完全可以。
button { }
button:hover { background-color: lime; }
button:active { background-color: fuchsia; }
button:focus { background-color: yellow; }