CSS - 从样式块扩展样式表样式
CSS - extend stylesheet styles from a style block
我需要根据用户的角色或组身份为某些元素实现动态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;
}
}
相关文章:
- 当包含另一个asp文件时,是否也包含所有引用的样式和脚本页面
- 将样式表插入iframe
- Node.js v6.2.0类扩展不是函数错误
- 跟踪在页面加载时应用内联样式的JavaScript
- 扩展移相器按钮类不工作
- chrome扩展中的navigator.geolocation.getCurrentPosition
- chrome扩展:尽管运行了at:documentidle,js脚本还是过早启动
- chrome扩展更改主机/域警告
- 使用JQuery将现有CSS样式扩展%-%
- CSS - 从样式块扩展样式表样式
- javascript样式的扩展标记信息
- Chrome扩展驻留样式表的运行时修改
- Firefox扩展地址栏样式
- 如何将coffeescript类扩展样式更改为cc.Class.extends({ator:function(){} .
- 在react.js中扩展样式对象
- 改变页面样式表在chrome扩展
- 为什么Javascript在google中工作'以下是Chrome扩展选项页面新样式的示例代码
- 扩展默认的OpenLayers编辑样式
- Chrome 扩展插件内联插入样式不起作用
- 扩展jquery.css函数来覆盖重要的样式