css3动画
问题描述
我想让他的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>
问题解答
回答1:你后面加了!important,颜色就不会变了。去了试试
回答2:去掉!important就可以了。加这么多!important是做什么?没看懂~!important一般不建议使用的吧~
相关文章:
1. 问题Unknown column ’’ in ’where clause’2. angular.js - 如何控制ngrepeat输出的个数3. html - vue项目中用到了elementUI问题4. javascript - 在使用 vue.js element ui的时候 怎么样保留table翻页后check的值?5. mysql_replication - mysql读写分离时如果单台写库也无法满足性能怎么解决6. javascript - vue组件通过eventBus通信时,报错a.$on is not a function7. css3 - css怎么实现图片环绕的效果8. linux - ubuntu 命令行中文 显示菱形,期望通过引入字体解决而不是zhcon这种方式9. ionic 项目 ionic build android -release 打包时报错10. python - 如何用pandas处理分钟数据变成小时线?

网公网安备