WedX - журнал о программировании и компьютерных науках

Как определить дополнительные источники для файла CSS в HTML

У меня есть приложение Spring Boot REST, и я хочу создать для него swagger.

Работает нормально, сваггер загружается без проблем.

Теперь я хочу быть универсальным и гибким одновременно:

  1. Первым приоритетом является загрузка файлов JS и CSS, связанных с swagger, в HTML из Интернета.
  2. Я также храню файлы JS и CSS, связанные с чванством, в исходном коде.
  3. Поэтому, когда приложение загружается, я хочу загрузить файлы из Интернета И только в случае сбоя загрузить их из источника в качестве запасного варианта.

Это решение отлично работает для JS, потому что я использую этот способ (сначала загружает JS из исходного кода, а затем переопределяет его из Интернета, если его можно найти):

<!-- swagger-ui-bundle.js -->
<script src="swagger/js/swagger-ui-bundle.js"></script>
<script src="https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js"></script>

<!-- swagger-ui-standalone-preset.js -->
<script src="swagger/js/swagger-ui-standalone-preset.js"></script>
<script src="https://unpkg.com/swagger-ui-dist/swagger-ui-standalone-preset.js"></script>

Но это не работает для CSS, я пробовал так:

<!-- swagger-ui.css -->
<link rel="stylesheet" type="text/css" href="swagger/css/swagger-ui.css">
<link rel="stylesheet" type="text/css" href="https://unpkg.com/swagger-ui-dist/swagger-ui.css">

Можно ли определить приоритет загрузки файлов CSS в HTML? Пожалуйста, дайте мне несколько примеров. Спасибо!


  • Это не кажется хорошим способом продолжить. Если оба файла существуют в Javascript, он переопределяет функции с тем же именем, но также может выполнять один и тот же код 2 раза, например, в событии onload. В CSS, если у вас есть два стиля, второй CSS перезаписывает первый, но суммирует стили. Пример: первый CSS .class {color: red; font-size: 12px;} второй .class {color: black; font-weight: bold;} результаты будут: .class {color: black; font-size: 12px; font-weight: bold;}. Это если оба существуют. Если один из двух все равно не существует, у вас могут быть замедления для ресурсов, которые не найдены. 29.07.2020
  • Действительно быстрый пример возможных проблем, если две версии будут разными. JSFiddle 29.07.2020
  • решение: ‹ссылка rel=stylesheet type=text/css href=unpkg.com/ swagger-ui-dist/swagger-ui.css onerror=this.onerror=null;this.href='swagger/css/swagger-ui.css'› но почему-то не работает для ‹script›.. . 29.07.2020

Ответы:


1

Это каскадная таблица стилей.

Они загружаются один за другим. Правила в более поздних css перезаписывают правила в ранее загруженных css. Это должно работать, когда вы сначала загружаете резервную версию, а затем интернет-версию. Проблема может заключаться в том, что вы определяете некоторые правила css, которые не перезаписываются оригинальной интернет-версией.

29.07.2020
Новые материалы

Как создать диаграмму градиентной кисти с помощью D3.js
Резюме: Из этого туториала Вы узнаете, как добавить градиентную кисть к диаграмме с областями в D3.js. Мы добавим градиент к значениям SVG и применим градиент в качестве заливки к диаграмме с..

Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…
Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..

Лицензии с открытым исходным кодом: руководство для разработчиков и создателей
В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..

Объяснение документов 02: BERT
BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..

Как проанализировать работу вашего классификатора?
Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

Работа с цепями Маркова, часть 4 (Машинное обучение)
Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..


Для любых предложений по сайту: [email protected]