我想让他的border在2s内闪动2种颜色没反映，这要怎么写?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Creating Modal Window with Twitter Bootstrap">
</head>
<style>
@keyframes borderbg {
0% {border: 1px solid red !important;}
25% {border: 1px solid #c0ccda !important;}
50% {border: 1px solid red !important;}
100% {border: 1px solid #c0ccda !important;}
}
@-moz-keyframes borderbg {
0% {border: 1px solid red !important;}
25% {border: 1px solid #c0ccda !important;}
50% {border: 1px solid red !important;}
100% {border: 1px solid #c0ccda !important;}
}
@-webkit-keyframes borderbg {
0% {border: 1px solid red !important;}
25% {border: 1px solid #c0ccda !important;}
50% {border: 1px solid red !important;}
100% {border: 1px solid #c0ccda !important;}
}
@-o-keyframes borderbg {
0% {border: 1px solid red !important;}
25% {border: 1px solid #c0ccda !important;}
50% {border: 1px solid red !important;}
100% {border: 1px solid #c0ccda !important;}
}
.cl-Input p{
width: 200px;
height: 200px;
border:1px solid #ccc;
animation: borderbg 2s;
-moz-animation: borderbg 2s;
-webkit-animation: borderbg 2s;
-o-animation: borderbg 2s;
margin: 20px;
}
</style>
<body>
<p class="cl-Input">
<p class="el-input__inner">
</p>
<p class="el-textarea__inner">
</p>
<p class="note-frame">
</p>
</p>
</body>
<script>
</script>
</html>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
你后面加了！important,颜色就不会变了。去了试试
去掉!important就可以了。
加这么多!important是做什么？没看懂~
!important一般不建议使用的吧~