实际使用情况下，自举列排序（推，拉）

在他们放弃使用push和pull类来更改列排序（http://getbootstrap.com/css/#grid-column-ordering）以下示例中的引导3文档：实际使用情况下，自举列排序（推，拉）

<div class="row"> 
    <div class="col-md-9 col-md-push-3">.col-md-9 .col-md-push-3</div> 
    <div class="col-md-3 col-md-pull-9">.col-md-3 .col-md-pull-9</div> 
</div>

我明白这是如何但为什么你不只是写下你希望它们出现在你的HTML中的顺序，像这样？

<div class="row"> 
    <div class="col-md-3"> ... </div> 
    <div class="col-md-9"> ... </div> 
</div>

我不能看到他们给出的例子任何可能的使用情况，因为无论是为了是col-md-3, col-md-9，或col-md-9, col-md-3你仍然不会获得任何设备上的任何或多或少的宽度 - 它们仍然合计为12.因此，为什么不按照正确的顺序在HTML中定义呢？

我明白这些类是如何工作的。但我不明白他们的用例可能是什么，因为他们似乎没有做任何你无法做到的事情，而是按照你想要的顺序定义事物。本质上，你无法在给定的设备上获得更多或更少的视口宽度，那么你会想要做这样的事情？

来源

2017-06-20 Andy

列排序类允许我们根据不同的浏览器大小更改网格系统的顺序。这意味着在大屏幕上，您可以拥有与手机屏幕不同的网格。

您可以检查此例如， https://scotch.io/tutorials/reorder-css-columns-using-bootstrap

来源

2017-06-20 11:33:57

您发布的链接非常有用，但我仍然不完全明白为什么要使用它。如果“B”比“A”更重要（内容明智），那么当然你仍然可以将它定义为“B，A，C”。这永远不会解决的是给你更多*宽*（因为这是不可能的），所以我不明白为什么以这种方式呈现列是有利的。这将有助于看到一个网站，其内容*订单以一种可感知的方式改变用户的方式。 – Andy

如果优先级随屏幕大小而变化，该怎么办？如果我希望在大屏幕中按A，B，C排序的项目，并且项目B在移动设备中拥有更多优先级，并且我想在手机中使用B，A，C，那又如何？那时候，bootstrap pull/push是非常有用的，我想。 –

，为什么你会不只是写在你希望它们出现在你的HTML

它的订单，因为当我们写标记我们也应该考虑它的语义。

例如，您有一个页面的左侧有一个侧边栏，右侧有一个文章。在您的标记层次结构中，文章应该位于侧边栏之前，因为文章是主要页面内容。

但是如果你float他们left，文章将在左侧，侧边栏将在右侧，这是你想达到的相反。所以要解决这个问题，你将使用push和pull类，你明白了。

这只是一个例子。当然，其他选项可用于实现相同的结果，例如float他们right，或者在文章之前放置边栏标记，但用<aside>元素包裹它。

来源

2017-06-20 15:12:51 Fahmi

实际使用情况下，自举列排序（推，拉）

回答

相关问题