Question

只是一个抬头我对Web开发很新，在我的例子中CSS3 + HTML5 + javascript

所以我有一个分为两列的部分。左栏为60％，右栏为30％。左边有段落，右边需要有3个包含我技能的进度条。这应该是直截了当但不幸的是它似乎不起作用，只有百分比显示出来。没有实际的栏。

<section id="about" class="main style1top dark fullscreen">
            <div class="content container 100%">

                <div class="column-left"> 
                    <h3 style="font-size:250%">About me</h3>
                    <hr>
                    <p>
                    Wow look at all my skills, I'm smart.
                    </p>        
                </div>

                <div class="column-right"> 
                    <h3 style="font-size:200%">Skills</h3>      
                        <div class="progress">
                          <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
                            60%
                          </div>
                        </div>
                </div>

            </div>

            <a href="#work" class="button style2 down anchored">Next</a>


        </section>

Answer 1

我猜你想要这样的结果。

JSFiddle

为此，您需要包含bootstrap

放置在<head></head>代码

中

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

放置在<body></body>代码

内的任意位置

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

此外，我建议阅读引导程序的Get Started部分。这将有助于格式化引导程序应用程序。

Bootstrap中的进度条仅显示百分比

1 个答案: