Question

是否可以将颜色从一个CSS类导入另一个CSS类？或者创建某种全局颜色定义，然后在多个类中使用它，这样如果你想改变颜色就不必在多个地方更新？

例如，假设我有一个CSS类，我想用于特定元素，但我希望它使用分配给Bootstrap“danger”类的相同颜色。有没有办法做到这一点？或者我只需要从Bootstrap CSS文件中复制颜色值并在我自己的类中使用它？

Answer 1

您可能还想查看Bootstrap 4中的新CSS variables。它们将允许您覆盖颜色，但您需要重新定义CSS类。

CSS变量为Sass的变量提供了类似的灵活性，但是在提供给浏览器之前无需编译。

例如：

.text-teal {
  color: var(--teal);
}

Bootstrap 4 CSS Variables Demo

Answer 2

使用SCSS

分配变量：

ul, .hero, .homepage, .anotherClass {
  background: $darkGrey;
}

使用这些变量：

library(flextable)
dat <- data.frame(
  col = "CRAN website", href = "https://cran.r-project.org",
  stringsAsFactors = FALSE)

ft <- flextable(dat)
ft <- display(
  ft, col_key = "col", pattern = "# {{mylink}}",
  formatters = list(mylink ~ hyperlinked_text(href, col) )
)
ft

更多信息：https://responsivedesign.is/articles/difference-between-sass-and-scss/

Answer 3

您可以在:: root选择器中分配全局颜色，如下例所示：

:root{
     --green-color:#fff123;
}

并在CSS的var（）函数中的任何地方使用此颜色，例如：

.container{
    background-color:var(--green-color);
}

.column{
   color:var(--green-color);
}

CSS使用另一个类的颜色？

3 个答案: