CSS Приоритет и иерархия

Question

Это, вероятно, будет очень простой вопрос для ответа, но я пытаюсь создать универсальный магазин для настройки значений свойств из SQL и хотел бы знать ответ на проблему, которая только что появилась в случае мозгового штурма:

Если вы устанавливаете родительский (допустим, форму) только для чтения, но устанавливаете объект (пусть говорят, кнопку) в этом родителе, чтобы он НЕ был доступен только для чтения, только? Кроме того, что, если родитель или ребенок!

Я пытаюсь настроить систему приоритетов, чтобы пользователи могли устанавливать эти значения свойств без проблем с непредвиденными ситуациями.

Answer 1

readonly не является собственностью css, поэтому не существует стиля. Он идет непосредственно в тег html.

Ключевыми словосочетаниями для поиска являются css inheritance и css specifity.

Для краткого обзора: Да, существуют фиксированные правила. Не каждое свойство наследуется. Вы можете посмотреть их, например. в MDN CSS Reference. Какое правило css запускается в зависимости от того, где вы размещаете правила стиля и как определен ваш селектор.

каскадных порядок (source):

1. Встроенный стиль (внутри элемента HTML)
2. Внешние и внутренние таблицы стилей (в головной части)
3. Браузер по умолчанию

Специфичность, как система оценки. Применяется правило с наивысшей оценкой (= наивысшая специфика).

1. ID, например. #paragraph {...} (100 баллов)
2. Класс, например. .redparagraphs {...} (10 баллов)
3. Тег, например. p {...} (1 точка)

Так правило div p span {...} будет иметь 3 балла, из трех тегов селекторов. #wrapper .centered #main .fancynews .withoutborder p {...} будет иметь 231 пункт и так далее.

Если два правила имеют одинаковую оценку (спецификацию), то последний обработанный счетчик (таблицы стилей обрабатываются сверху вниз).

«быстрый и грязный» трюк для применения стиля является добавление !important правилу как

.alwaysredtext { color:#F00 !important; } 

Это аннулирует независимо правило цвета вы сделали и везде, где (до тех пор, как они не имеют a !important). Это не рекомендуется из-за более поздних проблем ремонтопригодности.

p.s.: Не пропустите Specifity Calculator, где вы можете ввести и сравнить несколько правил выбора и посмотреть, какой из них «выигрывает».

Answer 2

Только <input> и <textarea> элементы поддерживают атрибут readonly, поэтому нет, то, что вы описываете, невозможно.