Homero Simpson dibujado con sólo código CSS

@ 17 . abril . 2008

Una vez ya vimos como alguien dibujó el cuadro de un paisaje usando únicamente código CSS. En esta ocasión tenemos a un perfecto Homero Simpson dibujado con sólo CSS, usando fuente Verdana y posicionamiento absoluto, generando de esta forma dibujos vectoriales directamente embebidos en el código html.

Román Cortes se ha animado a Dibujar a Homero, me permití copiar y pegar el código que el realizó para esta genialidad.

(intenten pasar el mouse encima y verán que no es una imagen, es puro código CSS)

o
o
o
o
(
O
O
O
\
L
(
O
O
O
O
O
\
L
(
O
|
|
\
\
|
|
\
\
\
\
(
(
8
o
o
o
(
(
8
o
o
o
o
)
)
b
o
O
o
o
o
o
o
o
)
b
o
O
o
o
o
o
o
o
o
o
o
/
/
/
_
_
_
C
C
O
(

El resultado es cross-browser; está comprobado en los siguientes navegadores bajo Windows:

  • Internet Explorer 5.5, 6 y 7
  • Opera 9
  • Firefox 2
  • Safari 3

Mis aplausos, esto demuestra la fuerza de CSS para realizar diseños complejos.

Nota del autor: para su correcta visualización la fuente Verdana debe estar disponible en el equipo

DanielSemperAutor: Daniel Semper, fanático de la tecnología y sus usos sociales, cinéfilo geek, al menos veo una película por semana, innovador en Front-End y activo lector de comics. En mis tiempos libres soy ingeniero y estudio una maestría en Sidney en la universidad de UTS. Me puedes contactar en: twitter, Google Plus.
e-mail: hola @ danielsemper.com

Noticias Similares

  • 2litros > raimundo illanes

    jajaja, muy bueno, muy buen ejemplo, ahora a buscar a darth vader

  • Bleend

    :O

    Alucinante. :D (y)

    PD: En el Feed sale solo una “o” XD

  • roberto

    ja. y asi se ve si elimino los css:

    o
    o
    o
    o
    (
    O
    O
    O
    \
    L
    (
    O
    O
    O
    O
    O
    \
    L
    (
    O
    |
    |
    \
    \
    |
    |
    \
    \
    \
    \
    (
    (
    8
    o
    o
    o
    (
    (
    8
    o
    o
    o
    o
    )
    )
    b
    o
    O
    o
    o
    o
    o
    o
    o
    )
    b
    o
    O
    o
    o
    o
    o
    o
    o
    o
    o
    o
    /
    /
    /





    _
    _
    _



    C
    C
    O
    (

  • FaCuZ

    El google reader no se ve

  • M@U

    Wow ! Que ingenio el de ese sujeto, y pasciencia sobre todo…
    :O

  • elfleat

    Wow Genial! Impresionante!

  • Peliculas Online

    Nunca me imagine que sepodia hacer eso con css, muy bueno el post, gracias por el aporte

  • KOKI

    Lindo muy lindo -.-! y yo conozco un programa que te lleva una imagen a código ASCII