CSS - 从样式块扩展样式表样式

CSS - extend stylesheet styles from a style block

本文关键字:样式 扩展 CSS      更新时间:2023-09-26

我需要根据用户的角色或组身份为某些元素实现动态css样式。

我的想法是从我的数据库中获取所需的动态值(十六进制颜色,背景图像URL),将它们写入页面,然后使用jQuery将这些值的样式添加到要动态的元素中。似乎很简单。 有人这样做过吗?

另一种方法是以某种方式使用标题样式块中定义的样式覆盖外部样式表样式。 这行得通吗? 您可以在样式块和外部工作表之间共享 css 样式吗?共享样式可以级联吗?

您可以混合内部和外部样式。内部、外部和内联样式都是级联的,内联样式优先于内部样式,内部样式本身优先于外部样式。

如果你想根据用户权限动态更改样式,为什么不在 body 标签中添加相关的类和 id,例如

<body id="admin" class="group-1">

然后使用 CSS 将角色和组分开,例如

#admin{
    background-color: rgb(255,155,105);
}
.group-1{
    font-family: sans-serif;
}
.group-2{
    font-family: Roboto;
}

您可以更进一步,使用像 LESS 这样的 CSS 预处理器为单个角色设置多个组的样式,例如

#admin {
    background-color: rgb(255, 155, 105);
    .group-1 {
        font-family: sans-serif;
    }
    .group-2 {
        font-family: Roboto;
    }
}