您的位置：首页技术文章
文章详情页

css - @keyframes 能接受参数吗？

浏览：198日期：2023-06-16 17:12:16

问题描述

@keyframes around { from { margin-left: 100%; } to { margin-left: -5em; } }

那个-5em应该是参数传进去的？可以解决吗？

问题解答

回答1：

设置自定义CSS属性结合var函数实现，自定义属性以--符号开头例子

<!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>

标签： CSS
上一条：css - 遮罩层遮不住视频是什么原因下一条：css3 animation动画参数问题
相关文章：
1. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法（标题说不太清楚，请见题内描述）2. MYSQL新建用户设置可以远程访问的问题3. $fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题4. java - mybatis怎么实现在数据库中有就修改,没有就添加5. node.js - nodejs和前端JavaScript 字符串处理结果不一样是什么原因？6. mysql多表联合查询优化的问题7. MySQL中的enum类型有什么优点？8. 数据库 - mysql 远程可以连接，但是本地连接拒绝？9. 数据库设计 - MySQL数据库主键问题10. linux - 为什么我在mysql的my.cnf下找不到bind-address？
排行榜
$fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题
$fields = $values = [];这条代码一直定义不了，一直报错，老师的源码也是被报错的,执行不了,请问该怎么解决这个问题
1. python - 求一个在def中可以实现调用本def满足特定条件continue效果的方法（标题说不太清楚，请见题内描述）
2. MYSQL新建用户设置可以远程访问的问题
3. node.js - nodejs和前端JavaScript 字符串处理结果不一样是什么原因？
4. java - mybatis怎么实现在数据库中有就修改,没有就添加
5. angular.js - 为什么Angular2和Ionic2都用TypeScript开发，TypeScript有什么优势吗？
6. angular.js - angularjs的自定义过滤器如何给文字加颜色？
7. javascript - 如何将 windows 下编辑器中的 CRLF 替换为 LF?
8. docker-compose中volumes的问题
9. mysql - 我的myeclipse一直连显示数据库连接失败，不知道为什么
10. Android自定义相机预览
热门标签