我最近在一个项目中使用SASS 3.2实现了这个技术,并且在需要时使用@content
块。现在,我需要包括对旧的浏览器,如IE7和8的支持。
例子:
.overview {
padding: 0 0 19px;
@include respond-to(medium-screens) {
padding-top: 19px;
} //medium-screens
@include respond-to(wide-screens) {
padding-top: 19px;
} //medium-screens
}
它们都不支持媒体查询,在过去,我通常通过将所有样式提供给这些浏览器来处理此问题,当我将媒体查询分别存储在不同的局部文件中,例如_320.scss、_480.scss,以及在我的IE样式表中加载它们时。
@import 320.scss;
@import 480.scss;
etc.
这段代码会加载所有样式,并且始终将IE7-8分配为940px(或最大宽度)的布局和样式。通过在SASS 3.2中像这样嵌套样式,可以消除单独部分样式表的需要,但完全破坏了我如何加载IE样式。
有什么想法或解决方案来解决这个问题吗?我可以使用诸如respond.js之类的polyfill来强制IE使用媒体查询,但更喜欢向IE提供非灵活的网站。
有关如何最好组织这些文件或更好的解决方案的任何想法?