Внешний порядок загрузки CSS-файлов

Question

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

Например, предположим, что у меня есть это в документации:

<link rel="stylesheet" type="text/css" href="https://foo.bar/project_stylesheet.css"> 
<link rel="stylesheet" type="text/css" href=".localprefs.css"> 

Желаемый результат в том, что .localprefs.css (если она существует) должна всегда переопределить глобальный проект таблицы стилей.

Есть ли гарантия для заказа на заказ, независимый от груза? Если нет, есть ли простой способ заставить проблему?

On edit: Предполагается, что .localprefs.css переопределяет выбранные стили из глобальной таблицы стилей.

Answer 1

То, как у вас есть, гарантирует заказ на загрузку. Первыми остаются файлы или загруженные CSS.

Таким образом, порядок загрузки не говорит о специфике правил в CSS.

Итак, у вас есть элемент <h1 id="foo" class="bar">. Если первая таблица стилей имеет номер #foo { color: red; }, а последняя таблица стилей имеет номер .bar { color: blue; }, тогда цвет h1 будет красным из-за специфичности идентификатора, имеющего приоритет над классом. Вы не можете форсировать определенность через загрузку CSS-кода. Чтобы установить специфичность, вы можете использовать !important.

Answer 2

Да. Он загружается в том порядке, в котором он находится в файле. Так что .localprefs.css загрузит второй.

Обратите внимание, что если селектор в первом файле более определен, он будет по-прежнему иметь приоритет (т.е. #id против .class). Любые связи будут выиграны более поздним файлом (т. Е. .class - .class)