在Bootstrap 3中使用twitter-bootstrap – col – * – 12(col-xs / col-sm / etc)

前端之家收集整理的这篇文章主要介绍了在Bootstrap 3中使用twitter-bootstrap – col – * – 12(col-xs / col-sm / etc)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在StackOverflow的代码示例和甚至是Bootstrap的例子中都没有出现的主题中看到了以下内容.
<div class="container">
  <div class="row">
    <div class="col-xs-12">
       <p>Words go here</p>
     </div>
    </div>
  </div>

要么

<div class="container">
  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
       <p>Words go here</p>
     </div>
    </div>
  </div>

它驱动我坚果,因为对于全宽单列,根据Bootstrap自己的文档和常识,它们都不正确.

什么时候实际使用电网系统? col – * – 12何时发挥作用?

解决方法

你的沮丧是正确的..< div class =“col-xs-12 col-sm-12 col-md-12 col-lg-12”>是完全多余的.

因为Bootstrap 3是首先移动的,所以你声明的任何类别都可以上传,这意味着它们适用于所声明的设备(xs,sm,md,lg)和更大的值.所以,col-xs-12 col-sm-12是多余的.只要使用col-xs-12来达到同样的效果.

另外,如果你不声明一个xs类,布局将默认为col – * – 12一次在你声明的小类col-class之下.例如< div class =“col-sm-6”>是sm的上半部分,而x宽的全宽.而< div class =“col-md-6”>是md上的一半宽度,而sm和xs上的全宽.

这就是说,你应该总是声明至少一个col-class,所以它得到相关的填充和其他样式的细节.

原文链接:https://www.f2er.com/bootstrap/234044.html

猜你在找的Bootstrap相关文章