Готовые стили в @keyframes
Нe знаю, как корректно сформулировать вопрос.
Можно ли вместо: <style>
@keyframes my {
from {
margin-left:100%;
}
to {
margin-left:0%;
}
}
</style>
сделать примерно так:<style>
.ani1 {
margin-left:100%;
}
.ani2 {
margin-left:0%;
}
@keyframes my {
from ani1;
to ani2;
}</style>
|
Нет
|
Paguo-86PK,
можно сами значения забить в переменные ... <!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
div{
width:100px;
height:100px;
animation: my 5s ease-in-out infinite;
background-color: #A8A8A8;
--max: 100%;
--min: 0%;
}
@keyframes my {
from {
margin-left:var(--max);
}
to {
margin-left:var(--min);
}
}
</style>
</head>
<body>
<div></div>
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 15:31. |