Como aplicar este estilo?

[MicroHack]

Hola,

soy un novato en practicas de CSS y estaba intentando replicar esta animación en CSS que me pareció muy chula:

http://daneden.github.io/animate.css/

Pido paciencia y simplicidad para contestarme porque no estoy todavia al nivel que estan los que trabajan a diario con esto.

Esto es lo que he hecho:

http://rlvconsulting.es/namaris/index.html (imagino que con el Inspector element podreís ver el código)

Porque el resultado no me queda igual que la pagina demo? Con esa bonita fuente y colores cambiando?

Es que a caso se usa algo más que CSS en este caso?

[pzin]

animate.css es solo una librería de animaciones CSS. El único estilo que te trae son para las animaciones. Colores, fuentes, tamaños, bordes y todo lo que quieras se lo tienes que poner tú.

En otras palabras, lo que has hecho está bien y ocurre lo que se espera que ocurra.

[MicroHack]

Iniciado por pzin

animate.css es solo una librería de animaciones CSS. El único estilo que te trae son para las animaciones. Colores, fuentes, tamaños, bordes y todo lo que quieras se lo tienes que poner tú.

En otras palabras, lo que has hecho está bien y ocurre lo que se espera que ocurra.

Y entonces que codigo hay que usar para los colores y fuente que usa el ejemplo? Porque le he dado a Inspector Element para ver el codigo y no veo que use mucho más.

[pzin]

Iniciado por MicroHack

Y entonces que codigo hay que usar para los colores y fuente que usa el ejemplo? Porque le he dado a Inspector Element para ver el codigo y no veo que use mucho más.

Será que no has mirado bien:



Luego también puedes mirar en los estilos computados:


Y también puedes marcar ahí arriba la casilla de mostrar estilos heredados.

Verás que el color también es una animación CSS.

[MicroHack]

Iniciado por pzin

Será que no has mirado bien:



Luego también puedes mirar en los estilos computados:


Y también puedes marcar ahí arriba la casilla de mostrar estilos heredados.

Verás que el color también es una animación CSS.

He copiado y pegado todo el codigo fuenta a mi pagina y he subido los archivos CSS descargados desde la web oficial (dsd GIT), pero no da el mismo resultado, algo falla y no se que puede ser :(

http://rlvconsulting.es/namaris/index.html

[pzin]

¿Has mirado la declaración @keyframes que lleva la animación del color? Si quieres usar una tipografía, ¿no deberías de tenerla cargada también?

Si quieres aprender CSS, como menos vas a aprender es copiando cosas por copiar.

[MicroHack]

Iniciado por pzin

¿Has mirado la declaración @keyframes que lleva la animación del color? Si quieres usar una tipografía, ¿no deberías de tenerla cargada también?

Si quieres aprender CSS, como menos vas a aprender es copiando cosas por copiar.

Es que el simbolo "@" no aparece en el tutorial de CSS que estaba yo siguiendo, pensaba que su funcion era la misma que "#", establecer un "id". He mirado por Google y ahora entiendo que realmente es una especie de API para ahorrar codigo al programador, en este codigo en concreto veo que hay como 150 "@" y todos empiezan por el nombre "keyframes"...¿Me puedes explicar brevemente por favor, que por google lo que he leido me parece confuso y no lo termino de entender? ¿Como localizo el que me interesa y lo aplico?

Gracias

[pzin]

https://developer.mozilla.org/es/doc...CSS/@keyframes