CSS 进度条实现代码- CSS样式表 - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > CSS 进度条实现代码

CSS样式表: 什么叫标准网页设计?; 什么是XHTML?; 巧妙的最大化动态载入IFrame的方法; 为什么要建立web标准与web标准的好处; 创建无表格网站的原因和原则译文; 一个新的CSS菜单代码; 客齐集OEM的CSS解析与开发经验; 页里面 CDATA的作用说明; ie中多id的调用方法; CSS设置网页的字体防浏览器浏览页面字体变形; 用css来控制图片大小显示的实现方法与代码; CSS入门教程篇; CSS选择符说明; IE和FIREFOX下CSS的区别与解决方法; 用CSS让表格返转的代码 IE only; 做网页经常要注意的常识整理收集; div+css实现的滑动门,简洁,新手上路 (小鸽子系列); css滤镜属性语法介绍; 百分比的细节－－容器大小篇; 你不一定知道的Label的For用法

No. « ‹ 37 38 39 40 › »

技术文章搜索

关键字

CSS样式表中的 CSS 进度条实现代码

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-11 浏览: 141 ::

收藏到网摘: n/a

CSS Display与Visibility的不同 css实现div在下拉菜单之上

<style>
#graphbox{
border:1px solid #e7e7e7;
padding:10px;
width:250px;
background-color:#f8f8f8;
margin:5px 0;
}
#graphbox h2{
color:#666666;
font-family:Arial;
font-size:18px;
font-weight:700;
}
.graph{
position:relative;
background-color:#F0EFEF;
border:1px solid #cccccc;
padding:2px;
font-size:13px;
font-weight:700;
}
.graph .orange, .green, .blue, .red, .black{
position:relative;
text-align:left;
color:#ffffff;
height:18px;
line-height:18px;
font-family:Arial;
display:block;
}
.graph .orange{background-color:#ff6600;}
.graph .green{background-color:#66CC33;}
.graph .blue{background-color:#3399CC;}
.graph .red{background-color:red;}
.graph .black{background-color:#555;}
</style>
<div id="graphbox">
<h2>BarGraphs Example</h2>
<div class="graph"><span class="orange" style="width:35%;">orange:35%</span></div>
<div class="graph"><span class="green" style="width:90%;">green:90%</span></div>
<div class="graph"><span class="blue" style="width:75%;">blue:75%</span></div>
<div class="graph"><span class="red" style="width:85%;">red:85%</span></div>
<div class="graph"><span class="black" style="width:100%;">black:100%</span></div>
</div>

提示：您可以先修改部分代码再运行

CSS Display与Visibility的不同 css实现div在下拉菜单之上

评论 (0) All