问题标签 [grid-system]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - Bootstrap 中的动态行
我在 Bootstrap 的网格系统中显示了 8 张图像。感谢该代码:
在 lg、md 和 sm 屏幕尺寸上,它是这样显示的(“X”代表图像):
XXXX
XXXX
在 xs 屏幕尺寸上,像这样:
X
X
X
X
X
X
X
X
我想实现:
在 lg、md 和 sm 屏幕尺寸上显示:
XXXX
XXXX
并在 xs 屏幕尺寸上显示:
XX
XX
XX
XX
有谁知道怎么做?
css - Bootstrap 网格系统列说明
我还在开始学习Bootstrap,对网格系统感到困惑。网格系统的描述说
Bootstrap 包括一个响应式、移动优先的流体网格系统,随着设备或视口大小的增加,它可以适当地扩展到12 列。
但是为什么在后面的例子中,他们会这样表现呢?
我知道 xs 是超小型设备而 md 是针对中型设备的,但是 xs 的类为什么是“col-xs-12”和“col-xs-6”?我的意思是,与 Bootstrap Grid System 的定义相比,它们现在最多添加 18 列。有人可以请教我吗?
twitter-bootstrap-3 - 使用 Bootsrap 设计响应式布局
我想要一个具有以下响应式布局的页面:
目标是使该页面具有响应性,以便每当屏幕太宽时,框 3 将跳到框 2 旁边(如图 2 所示)。为此,我使用 Bootstrap 的网格系统,为框 1 分配“8”跨度,为框 2 和 3 分配“4”。它按照我描述的方式工作。现在我想修复 Box 2 和 Box 3 的位置,所以当我滚动页面(查看 Box 1 的内容)时,我会在我的视口中看到 Box 2 和 3,我不想让 Box 1 可滚动!我希望整个页面滚动!您知道任何可以处理这种情况的 Bootstrap 解决方案吗?(我想保持整个页面的响应式布局)
这是我对该页面的基本代码:
现在我可以使框 1 可滚动,但它会将滚动条放在框 1 旁边,但我希望它位于页面的右侧,因此整个页面滚动,但框 2 和框 3 是固定的。同时,在大屏幕上,他们会改变他们的位置,所有 3 个盒子将彼此相邻!
有什么建议吗?
forms - 剑道用户界面模式/弹出窗口中的引导表单
可以在剑道 ui 的模态窗口中使用引导形式吗?我需要在许多列中输入的表单。我尝试像在普通 html 文件中一样使用默认引导程序,但这不能正常工作。谢谢
twitter-bootstrap - Bootstrap Grid - 如何选择?
我在这里的第一篇文章,
我正在 Photoshop 中设计一个布局,我知道有一个图层很重要,我有我的网格来根据它设计元素。
我在网上搜索 psd 下载并用于我的设计,我非常困惑。所以我只想知道在选择引导网格系统时必须考虑哪些标准。
要解决的方面让我感到困惑:
- 我应该选择哪个 Bootstrap 版本?并且基于什么?
- 列数?并且基于什么?
- 我应该选择哪种排水沟尺寸?基于什么?
请帮我解决这个问题,我不断看到数百万种不同的引导网格系统,我只是不知道如何选择。
感谢大家
html - 无法让列适合网格宽度
我正在使用语义 UI,无法正确设置网格。根据文档,语义 UI 使用 16 列,我试图three
在左侧有一列宽度为 ,在它旁边有一列宽度为thirteen
. 这是它的外观(图片被裁剪):
我已经使用 Bootstrap 很长时间了,现在尝试使用 Semantic UI。我错过了什么?演示
twitter-bootstrap - 流体网格系统是如何实现的,背后的原理是什么?
我刚开始学习 css,bootstrap 是最流行的 css RWD 框架。我只是好奇流体网格系统是如何实现的??
并且无意中学会了 wip w3c css 标准多列布局。和网格系统是同一个概念吗?当所有浏览器最终确定并完全实现它时,它是否会使所有网格系统库过时?