LESS CSS - 从嵌套类中进一步访问 dom 树中的类 [英] LESS CSS - accessing classes further up the dom tree from within a nested class

查看：20 发布时间：2022/1/7 13:27:48 css nested less

本文介绍了LESS CSS - 从嵌套类中进一步访问 dom 树中的类的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我希望能够使用 LESS CSS 从嵌套类中进一步访问 dom 树中的类，请参见示例:

HTML:

<身体><div class="内容"><div class="容器"><div class="logo"></div>

更少:

.container {.标识 {背景:网址(/images/ws-logo.gif)；}}

我想从 .logo 嵌套规则中定位 html 标签上的 .svg 类，以保持整洁，而不是像这样编写另一个规则:

.svg {.容器 {.标识 {背景:网址(/images/logo.svg)；}}}

所以，最好是这样的:

 .container {.标识 {背景:网址(/images/logo.gif)；(一些符号).svg {背景:网址(/images/svg-logo.svg)；}}}

我正在使用 Modernizr 来检测 svg 支持.

有谁知道这可能吗?或者有什么建议?

解决方案

是的！(更新)

当我在这里测试时，它奏效了！

 .container {.标识 {背景:网址(/images/logo.gif)；.svg &{背景:网址(/images/svg-logo.svg)；}}}

I want to be able to access classes further up the dom tree from within a nested class using LESS CSS, see example:

HTML:

<html class="svg">
 <body>
  <div class="content">
    <div class="container">
      <div class="logo"></div>
    </div>
 </body>
</html>

LESS:

.container {
  .logo {
      background:url(/images/ws-logo.gif);
  }
}

I want to target the .svg class on the html tag from within the .logo nested rule, to keep things tidy instead of writing another rule like this:

.svg { 
  .container {
    .logo {
        background:url(/images/logo.svg);
    }
  }
}

So, ideally something like this:

 .container {
    .logo {
        background:url(/images/logo.gif);

        (some-symbol).svg {
           background:url(/images/svg-logo.svg);
        }
    }
 }

I'm using modernizr to detect svg support.

Anyone know if this is possible? Or have any recommendations?

解决方案

Yes! (an update)

When I tested this here, it worked!

    .container { 
        .logo { 
            background:url(/images/logo.gif);
            .svg & {
                background:url(/images/svg-logo.svg);
            } 
        } 
    }

这篇关于LESS CSS - 从嵌套类中进一步访问 dom 树中的类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

LESS CSS - 从嵌套类中进一步访问 dom 树中的类 [英] LESS CSS - accessing classes further up the dom tree from within a nested class

问题描述

是的！(更新)

Yes! (an update)

相关文章

前端开发最新文章

热门教程

热门工具

登录关闭

LESS CSS - 从嵌套类中进一步访问 dom 树中的类 [英] LESS CSS - accessing classes further up the dom tree from within a nested class

问题描述

是的！(更新)

Yes! (an update)

相关文章

前端开发最新文章

热门教程

热门工具

登录 关闭

登录关闭