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

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

CSS样式表: 验证并修复css错误内容的相关工具; 分享3个比较实用的CSS页面框架布局; CSS幻灯片教程:制作高效可维护组件化的CSS代码; 网页制作基础知识:html特殊符号; CSS教程:按整洁易懂的结构组织CSS样式; 查看和编辑CSS中用到的颜色:CSS Prism; 帮助你学习CSS的在线CSS工具网站; CSS网页设计参考:把HTML标记分类; CSS进阶:几个Reset CSS的八卦问题; WEB设计技巧:网页虚线制作方法剖析; WEBJX收集CSS格式化和造型网页高级教程; CSS3教程:在CSS中使用的颜色; 学习WEB标准心得:网页重构的思路; 轻易创建css导航工具:CSS Tab Designer2; 总结学习web标准的十个重要理由; CSS实例教程:CSS制作星级评价的功能; CSS实例教程:纯CSS实现圆角框; 多个css、js文件自动合并、压缩; 网页设计教程:CSS文字排版技巧大全; Photoshop制作CSS网页制作的背景图

No. « ‹ 115 116 117 118 › »

技术文章搜索

关键字

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

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

收藏到网摘: 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