我知道网站的布局和功能应该严格分开。布局应该用CSS和网站的功能完成，比如在点击时展开移动菜单，应该用JS完成。 参考：1。 ＆安培; 2
我经常看到的响应式布局包括各种媒体查询的列类，其中只是类名不同，但宽度值相同。
然后以
的形式导致HTML<div class="container small-query-columns-4 medium-query-columns-6 large-query-columns-12><p>Responsive paragraph..</p></div>.
是否可以接受为各种媒体查询的列定义相同的宽度而不是仅创建一个最小的CSS网格，其中列类宽度定义为一次，然后动态传递媒体查询与查询？
我知道这会破坏上面给出的与布局（CSS）和函数（JS）的分离，虽然它意味着更清晰的HTML，每个媒体查询加上更少的CSS。查询也只对每个媒体查询调用一次，因此对于最小的CSS文件，下载量的命中也会少得多。是的，当然，这意味着该网站是JS依赖的。
答案 0 :(得分：1)
这不是坏主意，但我认为这也不是好主意。几周前我曾想过类似的东西。我想制作CSS，它将在浏览器中通过JS在几个循环中编译，然后附加到head部分。但经过深思熟虑，我决定不这样做。
我知道你可以制作后备和一些奇特的东西，所以它可以在每个有或没有js的浏览器中工作，但我看了看我的网格。它只需不到10KB。这是一个有趣的想法，但它并不需要花费太多工作。保持HTML的有序性，你不会遇到太多css类的问题。您必须让使用“框架”的人在某些断点处定义宽度。最简单的方法就是写一个类名。
考虑到当你使用例如bootstrap并希望在移动设备上有12列时，你只是不定义它并且它会自动落入该宽度。很多时候它足以用css类定义最多2个断点。
当我考虑enquirejs时，我认为它可以用于隐藏移动设备上的滑块。当你只显示：none它仍在运行和更改类。如果您有类似的东西应该删除，因为移动设备不是运行某些东西的好环境，您可以使用查询来禁用它。另一个例子是mansory grid，你可以通过enquirejs启动和禁用它。
基本上你可以使用它，如果你已经有js-depended的东西，并想在不同的屏幕上自定义它，或者给出不同的行为，因为如果你只是在窗口加载或文档加载上设置一些东西，你就会遇到一个问题调整窗口大小。在这里你可以使用它。