Less允许选择父选择器(http://lesscss.org/features/#parent-selectors-feature)
如何获得直接父选择器,而不是根父选择器？
我希望能够使用LESS CSS从嵌套类中进一步访问dom树中的类,请参阅示例:
HTML:
<html class="svg">
<body>
<div class="content">
<div class="container">
<div class="logo"></div>
</div>
</body>
</html>
减:
.container {
.logo {
background:url(/images/ws-logo.gif);
}
}
我想从.logo嵌套规则中的html标记上定位.svg类,以保持整洁,而不是像这样编写另一个规则:
.svg {
.container {
.logo {
background:url(/images/logo.svg);
}
}
}
所以,理想情况是这样的:
.container {
.logo {
background:url(/images/logo.gif);
(some-symbol).svg {
background:url(/images/svg-logo.svg);
}
}
}
我正在使用modernizr来检测svg支持.
任何人都知道这是否可行？或者有任何建议？
我有一个用于article和sectionHTML5标记的类.
在家里:
<article class="exit">
<a href="exit.php">
<figure class="box">
<img src="assets/img/projects/exit-m.jpg" alt="">
<figcaption>…</figcaption>
</figure>
</a>
</article>
在项目页面上:
<section class="page project exit">
<div class="corner nw intro">
<figure class="box">
<img src="assets/img/projects/exit.jpg" alt="">
<figcaption>…</figcaption>
</figure>
</div>
…
具有类exit的每个元素都包含一个figureHTML5元素.使用Less,我使用此代码来执行我想要的操作.
article.exit{width:260px; height:200px; top:315px; left:505px;
figure{background-color:@exit-bg;}
.box:hover{.perspective-box(se, 10, @exit-shadow);}
}
section.exit{
.box:hover{.perspective-box(nw, 10, @exit-shadow);}
.intro figcaption:hover{background:@exit-hover;}
}
但我必须指明它是一个article还是一个section!我有很多这样的课程,这有点烦人......
做这样的事情是否有解决方案？会很酷......
.exit{
&article{
width:260px; height:200px; top:315px; left:505px;
figure{background-color:@exit-bg;}
.box:hover{.perspective-box(se, 10, @exit-shadow);}
}
§ion{
.box:hover{.perspective-box(nw, 10, @exit-shadow);}
.intro …