我正在使用WinLESS，一种适用于Windows的LESS编译器。在style.less中，我使用@import指令导入我的768up.less和1030up.less等。
已编译的style.css内联解析768up.less和1030up.less内容，例如：
style.less @import "normalize.less";
/* base styling here */
@media only screen and (min-width: 768px) { @import "768up.less"; }
@media only screen and (min-width: 1030px) { @import "1030up.less"; }
style.css /* imported normalize */
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* etc */
/* base styling */
.wrap { margin: 0; padding: 0 5px; } /* etc */
/* imported 768up */
.wrap { padding: 0 20px; }
/* imported 1030up */
.wrap { padding: 0 30px; }
这是否会破坏与@import混合的@media的目的？我的意思是，style.css的文件大小现在是所有导入+编译文件的总和。
即使浏览器由于屏幕尺寸较小而无法使用1030up，它仍然会完整下载style.css吗？
编译的style.css是否应该包含@import指令不变，以便style.css变得更轻量级，并且只需指示浏览器检索{{1}时的其他样式满足标准？
WinLESS编译这些CSS文件对我来说是错误的吗？
理想情况下，我希望看到以下内容：
@media如果我误解了/* normalize */
@import "normalize.css";
/* base styling */
.wrap { margin: 0; padding: 0 5px; } /* etc */
/* progressively enhance styling to accomodate larger screens */
@media only screen and (min-width: 768px) { @import "768up.css"; }
@media only screen and (min-width: 1030px) { @import "1030up.css"; }
的整个概念，请赐教我！
答案 0 :(得分：2)
与减小尺寸相比，减少往返行程通常可以提高性能。
这与使用精灵表相同。发出4个1kb的请求要比发出1个20kb的请求要糟糕得多。
在这种情况下，它甚至不能同时执行请求。它必须获取第一个文件，解析它，然后它才会意识到它必须返回服务器才能获得另一个文件。
还要注意gzip是如何工作的。 1kb + 1kb！= 2kb。
如果您怀疑自己处于拆分文件的情况下，只有内联包含@import，如果它是.less，请尝试：
@media only screen and (min-width: 768px) { @import "768up.css"; }
@media only screen and (min-width: 1030px) { @import "1030up.css"; }
（注意.css而不是.less）
通过执行控制+ f，在http://lesscss.org/
上搜索“导入”可以找到更多详细信息您可以强制执行它所执行的导入类型：
@import (css) "foo.bar";
@import (less) "foo.bar";