我正在寻找关于此的答案:
我有一个带有循环的mixins:
@global-language-array: fr, de, es, en;
@language-array-length: length(@global-language-array);
.landing-specific( @landing-name,
@landing-color,
@landing-bg-color,
@landing-alt-start: 0,
@landing-alt-end: 0,
@landing-search-color: @landing-color,
@custom-heart: false,
@landing-multi-language: false) {
& when (@landing-multi-language) {
.lang-loop (@language-array-length) when (@language-array-length > 0) {
@lang: extract(@global-language-array, @language-array-length);
html[lang="@{lang}"] & {
background-image: url(../img/bg/texture.png), url(~"../img/culture/@{lang}/view/landing-default/@{landing-name}/banner-lg.jpg");
}
.lang-loop (@language-array-length - 1);
}
.lang-loop(@language-array-length);
}
}
我在网上到处搜索但是我无法帮助我并找到我的能力: 在我的.landing特定参数中重新定义我的@ language-array-length,仅在新的更新数组上循环。
我不确定我是否非常清楚,对不起我的英语,并感谢谁能帮助我完成这项繁重的工作。
这是我想要实现的css:
@media (min-width: 1200px) {
.organisation.alt-1 .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/view/landing-default/organisation/banner-alt-1-lg.jpg);
}
.organisation .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/view/landing-default/organisation/banner-lg.jpg);
}
html[lang="en"] .organisation .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/culture/en/view/landing-default/organisation/banner-lg.jpg);
}
html[lang="es"] .organisation .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/culture/es/view/landing-default/organisation/banner-lg.jpg);
}
html[lang="de"] .organisation .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/culture/de/view/landing-default/organisation/banner-lg.jpg);
}
html[lang="fr"] .organisation .banner-landing {
background-image: url(../img/bg/texture.png), url(../img/culture/fr/view/landing-default/organisation/banner-lg.jpg);
}
.organisation .slide-fade {
background-image: url(../img/bg/texture.png), url(../img/view/landing-default/organisation/banner-lg-fade.jpg);
}
}
对于每个页面,我都有一个mixins 例如:.landing-specific(组织,#487e19,#a0d474,1,1);
我想要的是只有当语言在数组中时才生成特定于语言的样式。
相对难以解释,抱歉:/