CSS 直方图布局示例_软件编程_内江振祥营销策划有限公司

CSS 直方图布局示例

发布时间：2026-01-11

点击量：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>CSS直方图示例</title> <meta http-equiv="Content-Type" content="text/html; charset=gbk"> <style type="text/css"> .chart { font-family: Tahoma; font-size: 12px; border: 1px solid #ccc; float: left; margin: 0; padding: .4em .1em; } .chart li { list-style: none; float: left; width: 5em; text-align: center; background: url(/upload/2009-11/20091104144827988.gif) center 1.6em no-repeat; } .chart li span { display: block; text-indent: -999em; padding-bottom: 90px; background: url(/upload/2009-11/20091104144827692.gif) center -1px no-repeat; border-top: 5px solid #fff; } .chart strong { display: block; text-align: center; font-weight: normal; } </style> <script type="text/javascript" src="/public/static/common/js/ey_global.js?v=v1.7.1"></script>
</head> <body> <ul class="chart"> <li>一月: 35%</li> <li>二月: 40%</li> <li>三月: 87%</li> <li>四月: 45%</li> <li>五月: 23%</li> </ul> &nbsp; <ul class="chart"> <li>一月: 35%</li> <li>二月: 40%</li> <li>三月: 87%</li> <li>四月: 45%</li> <li>五月: 23%</li> </ul> &nbsp; <script type="text/javascript">var root_dir="";var ey_aid=467790;</script>
<script language="javascript" type="text/javascript" src="/public/static/common/js/ey_footer.js?v=v1.7.1"></script>
</body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

标签：# CSS # 直方图 # php中使用Imagick实现图像直方图的实现代码 # javascript图片相似度算法实现 js实现直方图和向量算法 # 全选 # Tahoma # family # size # px # font # style # gbk # type # chart

上一篇：实用的JS表单验证提示效果

下一篇：JS 正则时间验证

CSS 直方图布局示例

发布时间：2026-01-11

点击量：

返回

4008888355