是否可以创建一个 CSS/SASS mixin 来检测当前 URL？

Question

我刚刚发现 CSS 的 @media 是一个 mixin，它采用 width/height/orientation 等不同的参数来确定使用的是什么设备，然后 mixin 应用一些基本的 CSS 风格。

我的问题是是否有可能创建一个非常相似的 mixin，例如 @address，它能够确定当前的 URL，然后应用一些基本的 CSS 样式。 可以这样使用的东西：

@address ("https://whosebug.com") {    

    /*if URL is https://whosebug.com then apply following styles*/

    h1 {
        color: red;
        font-size: 2.1em;
    }

    #myElement {
        background: #FFF;
        border: 1px solid #000;
    }
}

如果可能，我该如何创建这样的 mixin？如果不是，为什么？

Answer 1

没有。这显然是不可能的。如果它对你有帮助，你可以只捕获具有 href 属性的元素。我分享是因为它是关于使用链接的。

p a {
  color: #333  
}

p a[href="https://whosebug.com"]{
  text-decoration: none;
}

<p>
  <a href="https://whosebug.com">whosebug.com</a>
</p>

是否可以创建一个 CSS/SASS mixin 来检测当前 URL？

Is it possible to create a CSS/SASS mixin that detects current URL?

html

css

sass

less-mixins

gridle