自从大概两年前用css给sigt设计了logo后，我心里一直有个想法，我认为使用verdana字体和css里的绝对定位技术能画出更复杂的图案，也就是说，直接用html代码生成嵌入式的矢量图。
我选择绘制卡通剧《 辛普森一家》里的 荷马形象为代表，因为他的形象很流行，大家都认识：
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
(
–
这种绘制技术是各种浏览器都兼容的，我在下面这些浏览器中都试过：
internet explorer 5.5, 6 和 7 opera 9 firefox 2 safari 3 如果在你的电脑上没有正确的显示，那有可能是你使用linux，里面没有verdana字体，你可以从 msttcorefonts下载这个字体。
动画演示绘制过程 下面是动画演示这个荷马的形象是如何一笔一笔的制作出来的。这个动画演示过程对 román cortés的杰出原作没有任何修改，只是在里面的一些 div标签上加了 id属性，然后利用jquery将它们按顺序显示出来，这样你就能看到它的各个部分是如何一点一点的出现的了。
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
(
–
下面的按钮是让你选择动画的播放速度。