在我的网络应用程序中,我希望用长度与投票百分比成比例的彩条显示投票结果。我怎样才能实现这个与HTML/CSS?为投票结果创建彩条
3
A
回答
3
0
这实际上是非常简单的拉断。你希望每个酒吧由一个单一的代表。将div设置为所需的宽度(与结果成比例)。例如,如果你希望200px是投票的“100%”,那么如果一个选项有23%的投票你想.23 * 200是div的像素宽度。
然后根据需要设置背景颜色和边框以设置栏的样式。你也可以看中和使用图像(背景图像CSS属性),以获得更好看的酒吧。
我希望你指出正确的方向。
3
下面是一些示例代码:
<style>
.GraphWrapper {
width:300px;
border:1px solid #DDDDDD;
}
.BlueBar {
height:30px;
margin:10px 0px 10px 0px;
background-color:#FFCCCC;
}
.RedBar {
height:30px;
margin:10px 0px 10px 0px;
background-color:#CCCCFF;
}
</style>
<div class='GraphWrapper'>
<div class='BlueBar' style='width:50%;'></div>
<div class='RedBar' style='width:75%;'></div>
</div>
然后,您可以编辑您的图形栏的宽度风格实现图形的百分比。
0
我知道这是一个老问题,但新技术提供了一个新的解决方案。此外,没有任何答案被接受...
在HTML5中,您可以使用canvas element实际绘制图形。使用canvas元素可能非常复杂,所以在这里我不会详细讨论如何在特定场景中使用它。
但是,这里有一个简单的例子(从diveintohtml5.info复制):
HTML
<canvas id="graph" width="300" height="225"></canvas>
的JavaScript
var canvas = document.getElementById("graph");
var context = canvas.getContext("2d");
context.fillRect(50, 24, 150, 100);
相关问题
- 1. 为特定帖子创建投票投票WordPress的
- 2. 创建交互式投票有了结果页
- 3. 如何创建像jQuery/ajax函数stackoverflow的投票投票?
- 4. Drupal在代码投票API中创建投票通过代码
- 5. 创建一个会话不要再投票投票
- 6. 从Facebook获取投票结果图Graph
- 7. PHP/SQL投票并计算结果
- 8. C++创建彩票猜测程序
- 9. 评论与投票行为投票
- 10. 投票投票墙
- 11. 投票在端点上并创建一个可观察的结果
- 12. 创建投票应用程序。需要关于数据库结构的投票计数的建议
- 13. 如何在Facebook墙上创建投票?
- 14. 如何保存投票获取并保存在HTML上的投票结果
- 15. SWT投票为基础的色彩还原
- 16. 如何建立投票系统来支持多种投票类型的投票?
- 17. 投票与长投票
- 18. 投票重复投票
- 19. Rails Polymorphic投票结构
- 20. 加权投票制果报
- 21. java彩色滚动条搜索结果
- 22. 投票 - 票数与投票率?
- 23. 检查用户是否投票,如果不保存投票
- 24. 建模投票功能
- 25. 建模投票在GAE
- 26. 如何建模投票和反对投票?
- 27. 创建NSString结果为空
- 28. 基于投票投票的JQuery多个百分比投票
- 29. 彩票方法
- 30. 如何以json或xml格式获取彩票结果
如果你想23%的宽度,为什么不直接设置宽度为23%? :p – peirix 2009-05-28 12:53:28