当前位置: 首页 > 知识库问答 >
问题:

twitter引导中列流体类内9列相等

东方文林
2023-03-14

我想在我正在构建的页面上有9个相等的列,但我似乎不明白如何使用BootstrapVersion3.2来完成它。0

是否可以在类中创建7个相等的列。col-lg-12?

共有2个答案

唐兴思
2023-03-14

扩展引导网格是可能的

https://github.com/adamheins/bootstrap-grid-extension-generator

但我还是不明白你想完成什么?

印宏阔
2023-03-14

有可能:在这里输入链接描述

9柱网:

<ul class="list-inline row">
<li class="col-sm-4">
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
</li>
<li class="col-sm-4">
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
</li>
<li class="col-sm-4">
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
    <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
</li>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
    <ul class="list-inline row">
        <li class="col-sm-4">
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
        </li>
        <li class="col-sm-4">
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
        </li>
        <li class="col-sm-4">
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
            <div class="col-sm-4"><img src="//placehold.it/150x100" class="img-responsive"></div>
        </li>
    </ul>
</div>
 类似资料:
  • 本文向大家介绍twitter-bootstrap 引导行和列,包括了twitter-bootstrap 引导行和列的使用技巧和注意事项,需要的朋友参考一下 示例 Bootstrap的网格系统具有12个称为“列”的单元,可用于在视口上水平布置内容。 采用12个单位的网格(而不是10、16等)的原因是12均匀地分为6(一半),4(四分之一)和3(三分之三)。这使得适应各种布局变得更加容易。Bootst

  • 问题内容: 我想知道是否有人可以解释如何在引导程序中获得7个相等的列?我想做一个日历。此代码似乎可以执行5: 我的主要内容有以下课程,所以我希望将7列放在其中: Col-lg-12 谁能解释这是否可能,或者我是否必须坚持偶数? 问题答案: 好吧,IMO,您可能需要使用CSS3 查询来覆盖列的。 这是我创建7列网格系统的尝试: 的价值来自: 工作演示- 运行代码段,然后单击“整页”。 其他选择 另外

  • 我已经开始学习Bootstrap了。我的问题是如何中心对齐一个列水平,引导包含12列布局,没有中间数字。更清楚的是,如果是11列布局,中间的数字应该是6(左5列,中间1列,右5列)

  • 问题内容: 如何使用Twitter Bootstrap构建2列(固定-流体)布局? 你有什么解决方案? 问题答案: -另一个更新- 自从Twitter Bootstrap版本2.0(看到该类已删除)以来,不可能仅使用bootstrap类来实现两列固定流体布局- 但是我更新了我的答案以包括一些可以进行的小的CSS更改在您自己的CSS代码中,这将使其成为可能 可以使用下面的CSS以及从Twitter

  • 我正在使用Flume 1.6.0-cdh5.9.1使用Twitter源流式传输推文。 配置文件如下所示: 对于Cloudera. jar依赖项,我使用Maven使用以下依赖项构建了: 现在,当我运行Flume Agent时,它成功启动,连接到Twitter,但在最后一行(接收状态流)后停止: 在最后一行之后什么都没有发生。它不会终止,不会流式传输任何东西。我看了一下HDFS位置,那里没有创建任何东

  • 问题内容: bootstrap 2.0是否有任何帮助程序使.span1,.span2 .... span12的高度相等。我已经嵌套了这种类型的html 如果可能,我希望每口井的高度都一样吗? 问题答案: 这是一个响应式CSS解决方案,基于为每列添加较大的填充和同样大的负边距,然后将整个行包装在隐藏了溢出的类中。