相关疑难解决方法(0)

在http://getbootstrap.com/css/上它说:

我们使用以下媒体查询在网格系统中创建关键断点.

超小型设备(电话,最高480px):无媒体查询,因为这是Bootstrap中的默认设置

小型设备(平板电脑,768像素及以上):@ media(最小宽度:@ screen-sm){...}

中型设备(台式机,992px及以上):@ media(最小宽度:@ screen-md){...}

大型设备(大型台式机,1200px及以上):@ media(最小宽度:@ screen-lg){...}

我们是否应该能够在我们的媒体查询中使用@ screen-sm,@ screen-md和@ screen-lg名称？因为它对我不起作用.在它工作之前,我必须使用像@media(min-width:768px){...}这样的像素测量.难道我做错了什么？

另外,对于超小型设备而言,480px的参考是错字吗？不应该说高达767px？

在Bootstrap的LESS版本中,有人可以告诉我如何添加第五个设备大小,超大(col-xl-#)？

我很惊讶Twitter Bootstrap没有媒体查询来为移动纵向屏幕构建足够的网站版本.

一个棘手的事情是定义"移动肖像"宽度.以前大多数手机都有320px屏幕宽度,但目前最可取的方法是针对比较窄的设备375px.

iPhone scren决议

我至少需要屏幕宽度.col-xxs-*为断点的类375px,类似于.col-xs-*.这可以是CSS或SCSS代码.我正在使用Bootstrap-4-alpha,希望解决方案也适用于Bootstrap-3.

我正在使用特定的mixin试图让我的代码更清晰.所以不要使用:

<div class="col-lg-3 col-md-5 col-sm-6 col-xs-12">

我正在使用:

<div class="stackOverflowRocksIt">

在我的mixins.less:

.stackOverflowRocksIt{
    .make-lg-column(3);
    .make-md-column(4);
    .make-sm-column(6);
    .make-xs-column(12);
}

它适用于XS和SM视口,但不适用于我调整大小到MD或LG(然后采用SM大小).这是为不同视口大小创建列的正确方法吗？任何的想法？