根据CSS类中的属性值设置CSS样式属性

06odsfpq 于 2023-06-25 发布在其他

关注(0)|答案(1)|浏览(178)

假设一个元素有一个类，比如'my-css-class'。该类定义为：

my-css-class {
  font-family: 'RobotoBold';
  text-transform: lowercase;
  ... (some other properties)
}

在SCSS中有没有一种方法可以将一个特定的属性（比如font-weight或font-style或background-color）设置为一个基于font-family的值？
例如，如果font-family设置为'RobotoBold'，则将font-weight设置为粗体。类似地，如果font-family设置为'RobotoItalic'，则将font-style设置为斜体。字体家族的集合很小，如果需要的话，我可以列举出来。
制约因素：有许多类，改变每个类的名称，以便我可以模式匹配CSS类名是不切实际的。改变HTML也是不切实际的，因为有很多元素。
谢谢你的好心帮助。

css

来源：https://stackoverflow.com/questions/76518654/set-css-styling-property-based-on-property-value-in-css-class

1条答案

按热度按时间

hrirmatl1#

这个简单的jQuery代码就可以完成这项工作

if( $(".my-css-class").css('font-family').toLowerCase() == 'robotobold') {
    $(".my-css-class").css('font-weight', 'bold');
}

如果您可以将字体名称分配给一个变量，那么在SCSS中也是可能的：

$myfont: 'robotobold';

.my-css-class{
    font-family: $myfont;
    
    @if ($myfont == robotobold){
        font-weight: bold;
    }
}

赞(0）回复(0）举报 2023-06-25

我来回答

根据CSS类中的属性值设置CSS样式属性

1条答案

相关问题

热门标签

最新问答