css - 如何将 CSS var() 添加到手写笔内置函数中?

标签 css stylus

我试过这个:

:root {
  --primary-color: $black
}

$secondary-color = "lighten(%s, 20%)" % var(--primary-color)

(我从这里拿的:How to use a Stylus variable in calc?)

我没有收到任何错误。然而,$secondary-color不渲染任何颜色。

这样做的最佳方法是什么?

结果是这样的:
background-color: lighten(var(--primary-color), 20%)所以我认为有些东西渲染得不好。

最佳答案

这是行不通的,因为 1。lighten是一个在编译时执行的预处理器函数,而插值只是通过所有的东西和 2。lighten根本不应该使用 css 变量,因为它从一种颜色中提取数值,以便在编译时计算另一种颜色,在 css 变量的情况下,当时还不知道 3. 在 css 中这对于包含全色定义的 css 变量甚至是不可能的,因此预处理器也无法做到:为了在运行时进行颜色混合,您需要像 var(--primary-h) 一样将其分解。 , var(--primary-s)var-primary-l并使用 calc分别对值进行操作。

关于css - 如何将 CSS var() 添加到手写笔内置函数中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51394677/

相关文章:

javascript - Wordpress 主题中古怪的 JS 代码

css - 将 li 左中右对齐

node.js - 使用手写笔导入 Bootstrap

html - :nth-child() pseudoclass isn't working in list

css - 如何在中途反转循环?

css - 如何将重复的平铺图像插入 WordPress 页面或帖子的背景(不是页面背景)?

jquery - CSS3 - 使用 :checked selector on older browsers (ie7/ie8) 样式 radio 输入

javascript - 如何使用 HtmlWebpackPlugin 将编译好的 Stylus 包注入(inject) html 文件?

javascript - 当用户点击输入时如何聚焦输入?

css - Bootstrap 轮播控件在轮播之外