zoukankan      html  css  js  c++  java
  • Bootstrap 进度条



    @{
        Layout = null;
    }


    <!DOCTYPE html>


    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Index</title>
        <link href="~/Bootstrap3.3.7/css/bootstrap.min.css" rel="stylesheet" />
        <script src="~/Scripts/jquery-1.10.2.min.js"></script>  
        <script src="~/Bootstrap3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>
        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style=" 60%;">60%</div>
        </div>


        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min- 2em;">
                0%
            </div>
        </div>
        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="min- 2em; 2%;">
                2%
            </div>
        </div>


        <div class="progress">
            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style=" 40%">
               
            </div>
        </div>


        <div class="progress">
            <div class="progress-bar progress-bar-success progress-bar-striped"  aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style=" 40%">
                <span class="sr-only">40% Complete (success)</span>
            </div>
        </div>


        <div class="progress">
            <div class="progress-bar progress-bar-striped active" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style=" 45%">
                
            </div>
        </div>


        <div class="progress">
            <div class="progress-bar progress-bar-success" style=" 35%">
                35% 
            </div>
            <div class="progress-bar progress-bar-warning progress-bar-striped" style=" 20%">
                20%
            </div>
            <div class="progress-bar progress-bar-danger" style=" 10%">
                10%
            </div>
        </div>



        
    </body>
    </html>
  • 相关阅读:
    electron 显示对话框 showMessageBoxSync showMessageBox
    c++ 随机数 取值范围 多线程
    c++ 字符串转换为数字
    VS2019 C++动态链接库的创建使用(1)
    js mutationobserver property vs attribute
    Chromium base 基础库概览
    Git:合并分支----git merge命令应用的三种情景
    chromium 处理 addEventListener 事件
    JavaScript监听属性改变
    chrome 启动开关参数
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434663.html
Copyright © 2011-2022 走看看