css3按钮点击旋转90度

近年来，随着互联网的快速发展，网站的设计呈现出越来越多的创新与个性化，而按钮的设计也变得越来越重要。其中，CSS3的技术为按钮的设计提供了更多的可能性，如今我们能够使用CSS3实现按钮的点击旋转90度效果。

button {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  margin: 30px;
  
  transition: transform 0.5s;
}

button:active {
  transform: rotate(90deg);
}

如上代码所示，我们使用了CSS3中的transform属性实现了旋转的效果。这个属性可以包括多种不同的值，如旋转、缩放、扭曲等。在这里，我们使用了rotate()函数来将按钮旋转90度，而:hover伪类则用来定义当鼠标悬停在按钮上时应该产生的效果。

值得一提的是，这种按钮点击旋转90度的效果不仅可以应用于网页设计当中，也能够用于移动端应用的设计当中，给应用增添更多的动感和创新感。

总之，CSS3的技术为按钮的设计提供了更多的创意空间，让我们能够设计出更加优秀、时尚、个性、创新的按钮。希望通过今天的介绍，读者们能够了解并掌握这种按钮的效果，为自己的网站为自己的移动应用增添更多的设计魅力。