bootstrap 进度条

由于项目需求需要使用bootstrap 进度条,根据数量的不同从而使进度条的长度发生变化,并且以当前页的最大数量为指数1进行判断。

实例:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<div class="container" style="width:100%;float:right;margin:0;padding:0;clear:both;margin-top:<s:property value="dyHotTopsHeight"/>px">
       <s:if test="hotTopList != null && hotTopList.size() > 0"> 
			    <s:iterator value="hotTopList" var="hot" status="stat">
			     <div  style="width:100%;padding:0;margin:0;">
				      <div style="width:14%;height:10px;;float:left;margin-top:0px;">
				       	   <p style="color:#499BA8;font-family:'微软雅黑';font-size:16px; "><strong><s:property value="name"/></strong></p>
				      </div>
				      <div class="progress" style="width:72%;float:left;height:17px;border-radius:0px;background-color:#001E3B;">
						   <div class="progress-bar" role="progressbar" aria-valuenow="<s:property value="value"/>" aria-valuemin="0" aria-valuemax="100" style="width:<s:property value="percent"/>%;background-color:#063A83;">
						   </div>
						   <span class="sr-only"><s:property value="value"/></span>
					  </div> 
					  <div style="width:10%;height:10px;;float:left;margin-left:10px;">
					   	  <p style="color:#499BA8;font-family:'微软雅黑';font-size:16px; "><s:property value="value"/></p>
					   </div> 
				  </div>
				  <div style="clear:both;margin-bottom:5px"></div>
			    </s:iterator>
		</s:if>
		<s:else>
			<p style="width:300px;">
				    没有符合条件的数据...
			</p>
		</s:else>
</div> 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值