2016-03-03 2 views
0

Мне нужно реализовать динамические стили css для определенных элементов на основе роли пользователя или группы.CSS - расширение стилей стилей из блока стиля

Моя идея - извлечь требуемые динамические значения (шестнадцатеричные цвета, образы фонового изображения) из моей базы данных, записать их на страницу, а затем использовать jQuery для добавления стилей с этими значениями в элементы, которые должны быть динамическими. Это просто. Кто-нибудь сделал это так?

Другой способ - как-то переопределить стили стилей внешнего стиля со стилями, определенными в блоке стиля заголовка. Будет ли это работать? Можете ли вы делиться стилями CSS между блоком стиля и внешним листом? Могут ли общие каскады стилей?

ответ

1

Вы можете смешивать внутренние и внешние стили. Внутренние, внешние и встроенные стили все каскад, причем встроенные стили имеют приоритет над внутренними стилями, которые сами имеют приоритет над внешними стилями.

Если вы хотите динамически изменять стили на основе прав пользователя, почему бы не добавить соответствующие классы и идентификатор в теге body, например.

<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; 
} 

Вы могли бы пойти на один шаг дальше и использовать CSS препроцессор, как МЕНЬШЕ стиль несколько групп для отдельных ролей, например,

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

Но может ли часть определения css быть в блоке стиля в заголовке, а другая часть - во внешнем листе? Может ли блок стиля «расширяться» и внешний файл css? – nerdperson

+0

Да, они будут каскадными, с блочными (или внутренними) стилями, имеющими приоритет над внешними стилями. – symlink

Смежные вопросы