我使用SASS的一个项目,到目前为止,我很满意。 不过,我有一些代码,只使用类名来提出了IE 7及以下, .ie-lt8
了点。 但是,当我在SASS该选择器延伸,具有嵌套选择器I创建多个选择器。
实施例(延伸的display: inline-block
为IE代码):
上海社会科学院
/* My extension code */
.ie-lt8 %ie-inline-block {
display: inline;
zoom: 1;
}
/* I want the li to be inline-block */
#my-ul li {
display: inline-block;
@extend %ie-inline-block;
}
CSS制作
/* My extension code */
.ie-lt8 #my-ul, #my-ul .ie-lt8 li {
display: inline;
zoom: 1;
}
/* I want the li to be inline-block */
#my-ul li {
display: inline-block;
}
一般来说,这仅仅是罚款,但#my-ul .ie-lt8 li
担心我一点点。 在这个例子中这是确定的代码与两个选择(所提到的选择就是不存在的)工作正常。 但是,如果我有在选择件事是否与其他代码,那么这将导致一个问题。
一个想法例如:
上海社会科学院
/* I want the div to get a red border,
but the div inside .container to have a green border */
#myid .container div { border: 5px dotted green; }
#myid div {
@extend %red-border;
}
/* My extension code */
.container %red-border {
border: 1px solid red;
}
CSS它会产生
/* I want the div to get a red border,
but the div inside .container to have a green border */
#myid .container div { border: 5px dotted green; }
/* My extension code */
.container #myid div, #myid .container div {
border: 1px solid red; /* [OVERRIDE OF THE BORDER] */
}
我的问题是那么; 有没有一种方法,使SASS只需要最初的选择,无需从嵌套选择器(在一个句子很多选择的)创建多个选择?
我试图gooling对于这个问题,但我发现很难找到任何物品/博客/等。 关于这个问题。
UPDATE
我知道不同的解决方法,比如使用@混入的过程,而不是。 我只是想知道是否有一些像我错过regardig SASS,或者如果有人能告诉我这是为什么? 因为在我看来,喜欢它是一种错误的。