停止编译CSS尾部空格的SASS
我试图通过浏览器特定的CSS黑客攻击IE 8 & 9,如演示here。但是,我使用SASS(特别是WebCompiler Visual Studio扩展),它在分号之前编译出尾部空格。 因此停止编译CSS尾部空格的SASS
.class{ display: none \ ;}
成为
.class { display: none \;}
,并打破了黑客攻击。有什么办法可以解决这个问题吗?
如果你需要一个空格,你可以连接一个空字符串。
SASS:
.class{ display: none \ +'';}
输出:
.class {
display: none \ ;
}
我建议用conditional comments目标在HTML这样的:
<!--[if IE 8]> <html class="ie8"> <![endif]-->
<!--[if IE 9]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]> <html> <![endif]-->
而且在CSS:
.class {display: block;}
.ie8 .class {display: none;}
.ie9 .class {display: none;}
但是,如果你想保持一个清洁的HTML和较小的CSS,你可以使用一些JavaScript库针对特定的浏览器,类似DetectJS将浏览器名称和版本放在html标签中作为类,为每个浏览器生成分离的样式表,比在头部调用它们:
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->
<!--[if IE 9]>
<link rel="stylesheet" type="text/css" href="ie9.css" />
<![endif]-->
虽然我很欣赏这种做事方法,但在我工作的环境中,我需要避免添加额外的样式表,特别是对于一行css。 – Timestretch
因此,您可以使用js将浏览器信息添加到正文,然后将'.ie8 .class,.ie9 .class {display:none;}'放入您现有的样式表文件中。 –
你需要经常重新编译SASS?我会说,采取由此产生的CSS,手动替换空间,并使用,而不是SASS。 –