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. mysql 查詢身份證號字段值有效的數據2. python bottle跑起來以后,定時執行的任務為什么每次都重復(多)執行一次?3. 視頻文件不能播放,怎么辦?4. html5 - HTML代碼中的文字亂碼是怎么回事?5. python - 爬蟲模擬登錄后,爬取csdn后臺文章列表遇到的問題6. visual-studio - Python OpenCV: 奇怪的自動補全問題7. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處8. javascript - 彈出一個子窗口,操作之后關閉,主窗口會得到相應的響應,例如網站的某些登錄界面,django后臺的管理等,這是怎么實現的呢?9. javascript - ios返回不執行js怎么解決?10. android - 分享到微信,如何快速轉換成字節數組
