CSS 值时间

原文:https://www.geeksforgeeks.org/css-value-time/

CSS 值时间， <时间> ，代表以秒或毫秒表示的时间值。它用于动画、过渡和相关属性。

语法:

单位

属性值:

  • <数字> : 它代表我们想要的时间量或时长。前面可以有一个单独的 + 或–标志。
  • 单位:是表象。可以是 s 、女士

例 1:

<!DOCTYPE html>
<html>
<head>
<style> 
div {
  width: 100px;
  height: 100px;
  background: green;
  position: relative;
  animation: mymove infinite;
  animation-duration: 3s;/*CSS | Time */
}

@keyframes mymove {
  from {top: 0px;}
  to {top: 200px;}
}
</style>
</head>
<body>
<center><div></div></center>
</body>
</html>

输出:

例 2

<!DOCTYPE html>
<html>
<head>
<style> 
div {
  width: 100px;
  height: 20px;
  background: green;
  transition: width 2s, height 4s;/*CSS | Time*/
}

div:hover {
  width: 300px;
  height: 300px;
}
</style>
</head>
<body>
<div><p style="color:white">GeeksforGeeks</p></div>
</body>
</html>

输出:

版权属于：月萌API www.moonapi.com，转载请注明出处

本文链接：https://www.moonapi.com/news/7531.html