jQuery制作简单条形图的例子

本文介绍了用jQuery制作简单条形图的方法，供大家参考，具体的实现方法如下：

HTML的一部分：

复制代码代码如下所示：

条形图

CSS部分：

下面的代码复制如下：

。直方图容器{ position:相对；margin-left: 60px；边距：10px；margin-bottom: 25px；}

。直方图BG线{边界：# 999固体；边框宽度：0 0px 1px 1px；权利边界颜色：# EEE；溢出：隐藏；宽度：99%；}

。直方图BG线UL {溢出：隐藏；边界：# EEE固体；边框宽度：1px 000；明确：两；}

。直方图BG线李{浮动：左；溢出：隐藏；背景：# FFF；}

。直方图BG线里div {边界：1px # EEE固体；}

内容：绝对位置。直方图{；左：0px；最高：0；宽度：99%；高度：100%；}

直方图内容高度：100%；}

直方图内容：浮动：左；高度：100%；文本对齐：中心；位置：相对；}

。直方图箱{位置：相对；显示：内联块；身高：100%；宽度：20px；}

直方图的内容。李{位置：绝对的；下：0；右：0；显示：块；宽度：20px；字体大小：0；线高度：0；}

内容。直方图李。Histogram的名字{位置：绝对；底：- 20px；左：0px；空格：nowrap；显示：内联块；宽度：100%；字体大小：12px；溢出：隐藏；}。

。histogram-y {位置：绝对；左：- 60px；顶部：- 10px；字体：12px / 1.8宋体，宋体；}

。histogram-y李{文本对齐：右；宽度：55px；填充右：5px；颜色：# 333；}

。直方图BG线里DIV。histogram-y李{身高：30px； / *高度控制细胞的高度和比例，线条的比例和*