2008/09/22

11

CSS 进阶:数据图表的实现方式

sein , 10:44 am / 2,601 pv / 分享到微博

还记得改版之前的 google analysis 是什么样的吗?那些图表都是 css 生成而非现在的全 flash 样式。用 flash 开发的确漂亮,不过修改或者再改版就挺麻烦了。相信 diy 爱好者、不折腾会死星人、模板修改强迫症患者更愿意用 css 来实现这些很高级的图形。

具体实现方法请点原文并浏览其中的实例,查看 demo 的 css 你就能举一反三。说实话之前我知道 css 高手是可以完全用 html 网页的排版完全实现 word 的功能,没想到 excel 表格都能用 css 来做。digg link

贴几个图诱惑你们:
CSS 进阶:数据图表的实现方式

CSS 进阶:数据图表的实现方式

CSS 进阶:数据图表的实现方式

CSS 进阶:数据图表的实现方式

[ 上 ] [ 下 ]已有11条评论

  1. maco @ 2008-09-22 11:11:36 #1

    以为是用CSS写的颜色渐变,结果还是用的背景图片,有点失望的说。

    oo (0) / xx (0)
  2. 公主猫 @ 2008-09-22 11:17:32 #2

    抢地板!!!!!!!!!

    oo (0) / xx (0)
  3. 耗子小三 @ 2008-09-22 11:30:34 #3

    很好,今天正好要赶一份调查报告~~~借鉴了~~

    oo (0) / xx (0)
  4. steen @ 2008-09-22 11:33:18 #4

    同一楼

    oo (0) / xx (0)
  5. sein @ 2008-09-22 11:38:08 #5

    @maco: 改用图片的时候用图片啊,如果这么一个微不足道的地方都要css实现是不是有过了

    oo (0) / xx (0)
  6. weqre @ 2008-09-22 14:48:35 #6

    CSS渐变 也可以代替图片部分
    但是好像不是特别地有必要

    oo (0) / xx (0)
  7. chumsdock @ 2008-09-22 15:10:23 #7

    能画画的css叫svg

    oo (0) / xx (0)
  8. Yacca @ 2008-09-22 15:53:39 #8

    技术的应用是考验想象力的…

    oo (0) / xx (0)
  9. 老时 @ 2008-09-22 16:47:08 #9

    都是学问啊

    oo (0) / xx (0)
  10. Doris @ 2008-09-24 08:31:48 #10

    好东西,强烈收藏之

    oo (0) / xx (0)
  11. 村姑 @ 2008-09-26 10:13:53 #11

    这玩意儿还是相当牛叉滴!!!!
    摘个果子回去,研究研究。。。。。

    oo (0) / xx (0)

填写称呼和邮箱即可发布评论[ 上 ] [ 优 ] [ IMG ]