CSS 媒体查询不能 100% 工作有什么建议吗？

Question

在我的这份新工作中，我被投入到网站 build 中。长话短说，我不是一个前端开发人员，这就是此时需要完成的全部工作。它首先是为桌面设计的，然后是媒体查询，然后缩小到更小的尺寸。全部设置为以下样式:

@media (max-width:1200px)
@media (max-width:990px)

等...

所以我不是前端设计师，对整个响应式设计还是陌生的。我已经设法让一切都响应并适合我使用这些媒体标签的方式，但是，例如，跨度 1199px - 991px 中的所有样式都使用我设置的样式，但在实际的 1200px 或 990px​​ 媒体查询中断，我只剩下一个像素范围的时髦布局。有没有更合适的方法来布局我的媒体查询，比如用最小和最大宽度来解决这个问题？或者更好的是，是否有针对我当前设置的真正简单的修复，即使它不是最实用的方法？只是想把这个网站包起来。感谢社区!

Answer 1

如果编写不当，媒体查询可能会很痛苦。

如果您想根据不同的设备(或不同的屏幕尺寸)自动调整布局，请尝试使用 Bootstrap。

它提供了简单的类，你所要做的就是将类名添加到你的div中。

例如，要使 div 适合整个屏幕，您可以添加 col-lg-12(lg 表示大)。同样，还有 md、sm 和 xs(分别为中型、小型和超小型)

引用链接:http://www.w3schools.com/bootstrap/bootstrap_grid_examples.asp