css - @keyframes 能接受參數(shù)嗎?
問題描述
@keyframes around { from { margin-left: 100%; } to { margin-left: -5em; } }
那個-5em應(yīng)該是參數(shù)傳進去的?可以解決嗎?
問題解答
回答1:設(shè)置自定義CSS屬性結(jié)合var函數(shù)實現(xiàn),自定義屬性以--符號開頭例子
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Title</title> <style>@keyframes around { from {margin-left: 100%; } to {margin-left: var(--margin-left); }}.main{ position: absolute; left:0p; top:0px; width: 200px; height: 200px; background-color: #7C2845; color:#ffffff; --margin-left:-5em;}.main.active{ animation-name: around; animation-duration: 1s; animation-direction: alternate; animation-iteration-count: infinite;} </style></head><body> <p class='main active'>TEST </p></body></html>
相關(guān)文章:
1. python 利用subprocess庫調(diào)用mplayer時發(fā)生錯誤2. python文檔怎么查看?3. python - Pycharm的Debug用不了4. javascript - 關(guān)于apply()與call()的問題5. datetime - Python如何獲取當前時間6. javascript - nginx反向代理靜態(tài)資源403錯誤?7. html - eclipse 標簽錯誤8. 請問PHPstudy中的數(shù)據(jù)庫如何創(chuàng)建索引9. 安全性測試 - nodejs中如何防m(xù)ySQL注入10. python - pycharm 自動刪除行尾空格
