[分享]css3实现Js效果

CSS3是一种强大的样式表语言，它可以用来美化网页，并且还可以实现一些JavaScript效果，如动画和交互。下面是一些CSS3实现JavaScript效果的示例。/ 示例1：鼠标悬停变色/ butt...

CSS3是一种强大的样式表语言，它可以用来美化网页，并且还可以实现一些JavaScript效果，如动画和交互。下面是一些CSS3实现JavaScript效果的示例。

/* 示例1：鼠标悬停变色*/
button:hover {
  color: red;
}

/* 示例2：渐变背景色*/
div {
  background: linear-gradient(to bottom right, #00FFFF, #FF00FF);
}

/* 示例3：旋转动画*/
img {
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 示例4：变形动画*/
div {
  animation: transform 2s linear infinite;
}

@keyframes transform {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0.5);
  }
} 

上面的示例展示了CSS3可以实现的一些JavaScript效果。它们可以使网页更加生动、有趣，也可以帮助用户更好地交互。除了上面这些示例之外，CSS3还有很多其他功能，可以满足不同的网页需求。