Come faccio a dettare le dimensioni della funzione 'pulsare animate' usando css? - css

.element {
animation: pulse 5s infinite;
}

Questo anima l'elemento quasi a raddoppiare la dimensione dell'originale. come faccio a rendere il polso più piccolo?

risposte:

Penso che tu abbia bisogno di più per farlo funzionare di quanto pensi.

.element {
animation: pulse 5s infinite;
}

"Pulse" è il nome dell'animazione, non un comando css. Quindi "impulso" in questo caso deve avere parametri impostati. Questo viene fatto stipulando i fotogrammi chiave. Ad esempio se stai "pulsando" il testo ...

@keyframes pulse {
0%{
font-size: 10px;
}
50% {
font-size: 12px;
}
100% {
font-size: 10px;
}
}

Si noti che "0%" e "100%" hanno lo stesso valore? è così che si muove in circolo quindi sarà liscio se lo renderai infinito.