Bootstrap 4 接受 offset-md-*,而不是 col-offset-md-* 命名约定错误
Bootstrap 4 accepting offset-md-*, instead col-offset-md-* Naming Convention Bug
我只是 Bootstrap 4.
的初学者
我最近才开始学习它,很遗憾,我已经遇到了问题。我修改了 Bootstrap 4 手册本身的一些代码。然而,它惨遭失败,偏移量无法正常工作。代码非常简单,但不需要很多代码。
编辑:2016 年 5 月 25 日 [12:35 PM (GMT+8)]:
使用 Boootrap 3.3.6 版本,col-md-offset-* 正在运行。但是,在Bootrap 4中失败了。
问题已发布在 https://github.com/twbs/bootstrap/issues/19966!
这是我使用的代码:
<!-- This contains the .red, .blue and .green classes -->
<style> ... </style>
<div class="container">
<div class="row">
<div class="col-md-4 red">
Hello world
</div>
<div class="col-md-4 col-offset-md-4 green">
Hello world
</div>
<div class="col-md-4 col-offset-md-4 blue">
Hello world
</div>
</div>
因此,我怀疑 bootstrap 中是否存在名为 "col-md-offset-*" 的 class,因为它无法正常工作。因此,在 Safari 中,我打开 Develop > Show Web Inspector 并查看了通过 CDN 链接的 Bootstrap 文件。我搜索了 class col-md-offset-4
,没有出现。但是,我看到的是 md-offset-4
。我还看到,我发现的不是 class col-md-push-4
,而是 md-push-4
等等。因此,我改为使用 md-push-4
,它的效果与 Bootstrap.
中的示例一样好
编辑:2016 年 5 月 25 日 [晚上 9:03 (GMT+8)]:
这解决了用户 Nate Conley 的回答。顺便说一句,这是在编辑此问题时取自 http://v4-alpha.getbootstrap.com/layout/grid/ 的。在撰写本文时,Bootstrap 团队的任何变动都是不可预见或未知的。
因此,我修改了代码,它工作得很好。
<style> ... </style>
<div class="container">
<div class="row">
<div class="col-md-4 red">
Hello world
</div>
<div class="col-md-4 offset-md-4 green">
Hello world
</div>
<div class="col-md-4 offset-md-4 blue">
Hello world
</div>
</div>
问:问题出在我的浏览器、Safari (9.1) 还是 Bootstrap 版本 4、maxcdn 等?这是 Bootstrap 4 中的正常错误吗?
使用 Boootrap 3.3.6 版本,col-md-offset-* 正在运行。但是,它在 Bootrap 4 中失败了。
正如在我发布的一个问题上看到的那样,正如用户所推荐的 vp_arth here, in the Bootstrap 4 Development Repository in Github. 网格系统的 Bootsrap v4 文档,截至目前尚未应用来自 github,可通过以下链接访问:
a) Bootstrap Layout grid.md file
b) Examples of using the Grid System
简单回答:Safari 浏览器、CDN 和 Bootsrap v4 本身都没有问题,但实际上已经过时了 docs as of the time of writing. It will updated in the next alpha. More information can be seen in the closed issue thread I posted in here :)
(格林威治标准时间晚上 9:30+8)
Bootstrap 4 个文档确实正确地指出偏移 class 是 .offset-md-*
。据我所知,Bootstrap 4 不会向后兼容。我个人认为去掉 .col-
可以让它更容易阅读,并且输入更少(4 个字符,但我会接受)。
而不是 col-offset-*
使用 ml-*-auto
推送后续列
我只是 Bootstrap 4.
的初学者我最近才开始学习它,很遗憾,我已经遇到了问题。我修改了 Bootstrap 4 手册本身的一些代码。然而,它惨遭失败,偏移量无法正常工作。代码非常简单,但不需要很多代码。
编辑:2016 年 5 月 25 日 [12:35 PM (GMT+8)]:
使用 Boootrap 3.3.6 版本,col-md-offset-* 正在运行。但是,在Bootrap 4中失败了。
问题已发布在 https://github.com/twbs/bootstrap/issues/19966!
这是我使用的代码:
<!-- This contains the .red, .blue and .green classes -->
<style> ... </style>
<div class="container">
<div class="row">
<div class="col-md-4 red">
Hello world
</div>
<div class="col-md-4 col-offset-md-4 green">
Hello world
</div>
<div class="col-md-4 col-offset-md-4 blue">
Hello world
</div>
</div>
因此,我怀疑 bootstrap 中是否存在名为 "col-md-offset-*" 的 class,因为它无法正常工作。因此,在 Safari 中,我打开 Develop > Show Web Inspector 并查看了通过 CDN 链接的 Bootstrap 文件。我搜索了 class col-md-offset-4
,没有出现。但是,我看到的是 md-offset-4
。我还看到,我发现的不是 class col-md-push-4
,而是 md-push-4
等等。因此,我改为使用 md-push-4
,它的效果与 Bootstrap.
编辑:2016 年 5 月 25 日 [晚上 9:03 (GMT+8)]:
这解决了用户 Nate Conley 的回答。顺便说一句,这是在编辑此问题时取自 http://v4-alpha.getbootstrap.com/layout/grid/ 的。在撰写本文时,Bootstrap 团队的任何变动都是不可预见或未知的。
因此,我修改了代码,它工作得很好。
<style> ... </style>
<div class="container">
<div class="row">
<div class="col-md-4 red">
Hello world
</div>
<div class="col-md-4 offset-md-4 green">
Hello world
</div>
<div class="col-md-4 offset-md-4 blue">
Hello world
</div>
</div>
问:问题出在我的浏览器、Safari (9.1) 还是 Bootstrap 版本 4、maxcdn 等?这是 Bootstrap 4 中的正常错误吗?
使用 Boootrap 3.3.6 版本,col-md-offset-* 正在运行。但是,它在 Bootrap 4 中失败了。
正如在我发布的一个问题上看到的那样,正如用户所推荐的 vp_arth here, in the Bootstrap 4 Development Repository in Github. 网格系统的 Bootsrap v4 文档,截至目前尚未应用来自 github,可通过以下链接访问:
a) Bootstrap Layout grid.md file
b) Examples of using the Grid System
简单回答:Safari 浏览器、CDN 和 Bootsrap v4 本身都没有问题,但实际上已经过时了 docs as of the time of writing. It will updated in the next alpha. More information can be seen in the closed issue thread I posted in here :)
(格林威治标准时间晚上 9:30+8)
Bootstrap 4 个文档确实正确地指出偏移 class 是 .offset-md-*
。据我所知,Bootstrap 4 不会向后兼容。我个人认为去掉 .col-
可以让它更容易阅读,并且输入更少(4 个字符,但我会接受)。
而不是 col-offset-*
使用 ml-*-auto
推送后续列