【问题标题】:Bootstrap 3 new grid system and col-lgBootstrap 3 新的网格系统和 col-lg
【发布时间】:2015-04-11 00:05:10
【问题描述】:

我正在尝试从 bootstrap 2 迁移到 3,但我遇到了新的网格系统问题,其中 col-lg-* 而不是 span*

我的英语很蹩脚,所以我用例子来说明我的问题:

基本引导程序 2 模板: http://bootply.com/71498

还有 bootstrap 3,相同的模板,但我使用 col-lg-* 而不是 span*

http://bootply.com/71499

有什么想法吗?

【问题讨论】:

    标签: twitter-bootstrap twitter-bootstrap-3


    【解决方案1】:

    部分标签已更改。就像“thumbnail”现在是“img-thumbnail”一样,嵌套的行通常应该最多堆叠 12 列。

    <div class="container">
    <div class="row">
        <div class="col-lg-8">
                <div class="row">
                    <div class="col-lg-3">
                        <img class="img-thumbnail" src="http://placehold.it/200x150">
                    </div>
                    <div class="col-lg-9">
                        <header class="entry-header">
                            <h2>Lorem Ipsum</h2>
                        </header>
                    <p>Lorem Ipsum</p>
                    </div>
                </div>
        </div>
        <div class="col-lg-4">
            Column 4
        </div>
    </div>
    

    【讨论】:

    • 朋友向我解释了它现在是如何工作的,感谢缩略图提示。
    【解决方案2】:

    这应该可以工作

    <div class="col-lg-8">
                <div class="row">
                    <div class="col-lg-3">
                        <img class="thumbnail" src="http://placehold.it/200x150">
                    </div>
                    <div class="col-lg-9">
                        <header class="entry-header">
                            <h2>Lorem Ipsum</h2>
                        </header>
                    <p>Lorem Ipsum</p>
                    </div>
                </div>
        </div>
    

    【讨论】:

      猜你喜欢
      • 2013-08-11
      • 2015-08-19
      • 2014-08-10
      • 2013-10-24
      • 2018-07-03
      • 2013-08-06
      • 2020-06-23
      • 2015-03-06
      • 2014-03-05
      相关资源
      最近更新 更多