Question

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

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

另一种方法是以某种方式覆盖使用标题样式块中定义的样式的外部样式表样式。这会有用吗？你能在样式块和外部工作表之间共享css样式吗？共享样式可以级联吗？

Answer 1

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

如果您想根据用户权限动态更改样式，为什么不在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;
    }
}

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

1 个答案: