引导程序中的图标行答案

【问题标题】：Row of icons in bootstrap引导程序中的图标行
【发布时间】：2016-08-28 08:24:49
【问题描述】：

我正在开发我的个人网站，在我的技能部分中，我想在容器顶部放置一排图标。但是，当我尝试将 row-fluid 放在顶部时，我遇到了问题。

我已附上相关代码和屏幕截图以供参考。任何帮助表示赞赏！

<!--SKILLS DESCRIPTION -->
<div id="skillswrap">
    <div class="container">
        <div class="row">
            <div class="wow fadeIn" data-wow-duration="5s" data-wow-offset="100">
                <div class="col-lg-2 col-lg-offset-1">
                    <h4 style="color:white"><b>SKILLS</b></h4>
                </div>
                <div class="row-fluid">
                    <p><img class="img-responsive" src="Theme/assets/img/html5.png" alt="" style="zoom:60%"></p>
                </div>
                <div class="col-lg-3 centered">
                    <p><b>Front End Programming Skills</b></p>
                    <h5>HTML, CSS, JavaScript, Bootstrap, JQuery, AngularJS, Ionic Framework, D3
                        <br>

                </div>
                <div class="col-lg-3 centered">
                    <p><b>Scripting Language Skills</b></p>
                    <h5>Python, Ruby</h5>
                    <br>
                </div>
                <div class="col-lg-3 centered">
                    <p><b>Object Oriented Experience</b></p>
                    <h5>Java, C++</h5>
                    <br>
                </div>

                <div class="col-lg-3 col-lg-offset-3 centered">
                    <p><b>Communication</b></p>
                    <h5>Strong writing, collaborative and interpersonal skills.</h5>
                    <br>
                </div>
                <div class="col-lg-3 centered">
                    <p><b>Software</b></p>
                    <h5>Exposure to: Postman, JetBrains IDEs, Eclipse, Version control w/ Git, Adobe Creative
                        Suite.</h5><br>
                </div>
                <div class="col-lg-3 centered">
                    <p><b>Diverse Technical Skills</b></p>
                    <h5>Programming, agile methedologies, QA testing, content management, data analytics</h5>
                    <br>
                </div>

            </div><!--/.row -->
            <br>
        </div><!--/.container -->
    </div>
</div><!--/ #skillswrap -->

【问题讨论】：

标签： css html image twitter-bootstrap

【解决方案1】：

您将拥有offset 或push 引导类来将图像向右推送，即：将col-lg-offset-1 添加到类中，

或

通过position css 属性自己做，即：position:relative;left:10px

http://getbootstrap.com/css/ 了解有关如何使用偏移量、推送类的更多信息。

【讨论】：