超过 1200 像素的网站的响应能力 [关闭]答案

【问题标题】：Resposiveness in a website over 1200px [closed]超过 1200 像素的网站的响应能力 [关闭]
【发布时间】：2017-03-21 17:58:35
【问题描述】：

我一直在使用引导程序开发一个网站以使其具有响应性。但是当屏幕尺寸超过 1200 像素时就会出现问题。 m 谈论的网站是电子商务网站，所以 m 使用 col-* 连续显示 3 个产品现在，当屏幕尺寸超过 1500 像素时，我希望它连续显示 4 个产品，而不是将页面大小限制在 1200 像素，从而制作一个框

我希望它有意义类型

【问题讨论】：

你需要展示一些代码，更仔细地解释你希望它如何工作以及它实际上做了什么，并提出一个明确的问题
您可以在 3 元素行下方添加一个包含 4 个元素的第二行。并根据媒体查询隐藏其中一个？这是我可以考虑在没有 js 的情况下这样做的唯一方法
是的，现在当我想到它时，我应该添加更多的引导程序必须提供的突破点，这样我就可以让它响应更大的屏幕尺寸 tyvm 每个人:)

标签： javascript jquery html css responsive-design

【解决方案1】：

您应该添加媒体查询但恢复效果，min-width 而不是max-width 为1200px，所以将取自1200px 和更多，像这样：

@media (min-width: 1200px) { /*1200 and beyond*/

}
@media (max-width: 1200px) { /*Large Desktop*/

}
@media (max-width: 992px) { /*Desktop*/

}
@media (max-width: 768px) { /*Tablet*/

}
@media (max-width: 480px) { /*Large Phone*/

}
@media (max-width: 360px) { /*Medium Phone*/

}
@media (max-width: 320px) { /*Small Phone*/

}

【讨论】：