Esto no es para copiar, esto no es para aprender, esto no es para ... nada excepto soprenderse por lo que vendrá y pasarse un rato largo intentando meter tanta cosa en una entrada de Blogger.
Pure CSS Fail Whale by Steve Dennis es eso, un dibujo realizado enteramente con CSS cuyo autor debe haberse tomado unas merecidas vacaciones luego de escribir semejante cantidad de códigos.
Lo que veremos dependera del navegador que utilicemos; en Internet Explorer no será otra cosa que un dibujo torpe [ ver captura ]; en Firefox 3.6 y Opera, será un dibujo estático; en Chorme y Safari será una animación que es el preludio de lo que nos depara el futuro, cuando el resto de los navegadores incorporen las propiedades necesarias.
Pure CSS Fail Whale by Steve Dennis es eso, un dibujo realizado enteramente con CSS cuyo autor debe haberse tomado unas merecidas vacaciones luego de escribir semejante cantidad de códigos.
Lo que veremos dependera del navegador que utilicemos; en Internet Explorer no será otra cosa que un dibujo torpe [ ver captura ]; en Firefox 3.6 y Opera, será un dibujo estático; en Chorme y Safari será una animación que es el preludio de lo que nos depara el futuro, cuando el resto de los navegadores incorporen las propiedades necesarias.
Click para ver el resultado.
REFERENCIAS:Mamanunes en Twitter
Como? que? este es un verdadero artista!
ResponderBorrar¡¡un gran trabajo se mando el pibe!!
ResponderBorrarGuau! Qué trabajo! Y como siempre, Explorer un paso por detrás.
ResponderBorrarJuro ante Vagabundia, por Blogger, IE, Mozilla, Opera...no intentar hacerlo, ni copiarlo!
ResponderBorrarYa lo había visto, pero no sabía que era con CSS ohhh mi mae sí que hay que tener cabecita para realizar la ballenita y los pajarillos :P
Superior!
ResponderBorrar¡Wow! :O
ResponderBorrarYo no sé si podría estar tanto tiempo jugando con los códigos sólo por amor al arte :P.
JMiur, quería hacerte una consulta rapidita que no tienen que ver con el tema (:$):
¿Cómo puedo cambiar las viñetas de la lista de comentarios recientes por íconos? No es tan fácil como las de los posts y por eso estoy confundida :S.
Agradecería muchísimo tu ayuda, porque de plano ya no sé que hacer :P.
¡Saludos!
Increíbles las diferencias entre los navegadores, aparte de la genialidad con CSS, un ejemplo bien práctico para mostrárnoslas.
ResponderBorrarUn saludo!!
Es bastante loco ponerse a hacer estas cosas pero bueno ... por suerte, hay locos :D
ResponderBorrarM A M B A:
Podrías colocarla como una imagen de fonto. Por ejemplo, algo así, colocaría la misma viñeta que veo en las listas de las entradas pero claro, puede ser cualquier otra imagen:
#HTML11 li {
background: transparent url(http://img294.imageshack.us/img294/4661/asterisco.png) no-repeat left top;
padding:0 0 0 15px;
}
¡Muchas gracias! Ha dado resultado :D .
ResponderBorrarAdemás, logre quitar las viñetas agregando al final del código que me diste esto:
list-style: none;
Y ahora veo que podría configurarlas como en los posts, pero prefiero dejarlo así, no tiene caso complicarse tanto.
Muchas gracias de nuevo, sin ti nunca hubiera arreglado el problema :P.
Me alegro que funcionara :D
ResponderBorrarJajaja buenísimo, ... si no necesitó unas buenas vacaciones, por lo menos si un buen masaje en las sentaderas jajaj.. :D
ResponderBorrar