Почему при изменении css файла не происходит изменений

Изменения CSS не отражаются. Зачем?

Я работаю над своим сайтом, и всякий раз, когда я добавляю некоторые новые строки в свой CSS файл, он просто не хочет использовать строки, которые я сделал.

Но они должны быть в порядке.

Файл CSS работает с одной стороны, но откуда-то он просто перестает использовать мой файл. Тем не менее, он связан в < голова > .

И мой код HTML следующий (обратите внимание, что это всего лишь часть кода):

Кто-нибудь знает решение для этого?

11 ответов

Обычно причиной является одно из следующих:

1) Ваше правило не применяется

Это может произойти, потому что:

  • ваш HTML не очень хорошо сформирован (но в целом браузеры справляются с ним);
  • ваш CSS имеет синтаксические ошибки;
  • некоторый другой файл CSS (с одинаковыми/схожими правилами) загружается после вашего (порядок декларации считается, последний выигрывает);
  • некоторые другие правила CSS с более высокой спецификацией загружаются всюду на странице и выигрывают по правилам вы хотите применить (Дополнительная информация об этом ответе);
  • некоторые другие правила CSS используют ключевое слово !important.

Вы можете проверить этот с помощью инструментов разработчика для браузера, проверить панель CSS, где правила перечислены по важности в порядке убывания (от более того до менее важного).

2) Ваш CSS файл кэшируется

Это может произойти, потому что ваш сервер или ваш браузер кэшируют ресурс CSS. Чтобы принудительно обновить ресурс, вам нужно нажать CTRL F5 вместо F5 только один раз (после того, как вы перераспределили свой статический ресурс).

  • CTRL F5 работает (работает?) по-разному в разных браузерах;
  • обратите внимание, что в то время как Ctrl + F5 заставит браузер выкинуть кеш и запросить новое с сервера, сервер может игнорировать no-cache header и обслуживать кешированную страницу на стороне сервера. Таким образом, даже Ctrl + F5 может вернуть старую версию страницы, если сервер игнорирует no-cache header. (от комментария до принятого ответа).

Если сервер игнорирует запрос браузера на очистку кеша (иногда это происходит), самым быстрым способом, который я нашел для решения этой проблемы, является: ввод в адресной строке URL-адреса статических ресурсов и нажмите CTRL F5 на этой странице (то есть файл CSS), вместо этого на странице, импортирующей его. Это работает в 100% случаев.

Чтобы сделать это быстро, используйте Open link in a new Tab из браузера DevTools или нажав ссылку CSS по HTML, открытому с помощью View Source .

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

Простое использование инструментов разработчика для отключения кеша будет работать во время разработки, но если ваш рабочий процесс основан на частом размещении в Интернете, вы, в конце концов, столкнетесь с ситуацией, когда вы больше не контролируете, какую версию вашего кода CSS видят ваши посетители (и вы не могут рассчитывать на них, используя свои инструменты разработчика, чтобы отключить кеширование).

Чтобы предотвратить подобный случай, вы должны использовать метод "перехват кеша", который по сути означает, что вы будете добавлять материал к URL-адресам ресурсов, которые будут меняться каждый раз при изменении ваших файлов ресурсов. По существу ваш URL-адрес CSS преобразуется из этого

к чему-то вроде этого

Существует много сообщений о переполнении кеша на SO, поэтому вы можете взглянуть на все доступные параметры, прежде чем решать, как вы хотите справиться с этой проблемой.

Мой личный любимый метод сочетает код на стороне сервера с mod_rewrite, чтобы добиться перебора кеша. Рабочий процесс следующий.

1) На стороне сервера используется DOMDocument, чтобы искать все файлы ресурсов в сгенерированном HTML-коде, например CSS, JavaScript и т.д. добавляет измененную временную метку, полученную с помощью filemtime.

Пример: /css/main.min.css становится /css/main.min-1422585377.css в коде, который будет возвращен клиенту (браузеру).

2) Когда браузер получает ответ, ему просто придется обрабатывать этот запрос CSS как новый ресурс, если добавленная временная метка не соответствует таковой в кеше (ресурс с другим именем всегда рассматривается как новый запрос).

Webpack не ребилдит файл при изменениях

если поменять содержимое script.js , и запустить комманду webpack-dev-server модуль тоже билдится с новым кодом. НО! Когда я вношу изменения в исходный файл илю удаляю скомпилированный, изменения не применяются и новый файл не создается, даже не смотря на то, что в консоль пишет:

вот мой webpack.config.js :

  • "webpack": "2.4.1",
  • "webpack-dev-server": "2.4.2"

Вопрос: Чего ему не хватает? Почему не происходит ребилд при изменении содержимого файла?

Почему после редактирования файла style.css дизайн не изменяется?

Подскажите, почему при редактировании файла CSS находящегося в папке темы (c:\web\home\drupal-6.ru\www\sites\all\themes\pixture_reloaded\style.css) ничего не происходит?

И для чего нужен этот файл если к странице подключается /sites/default/files/css/a17ffd9fd2057cdc90089f87894c5ac5.css

Я так понимаю, что второй файл — это оптимизированный style.css? Или ошибаюсь? Как сбросить эту оптимизацию? Очистка кеш браузера и drupal не помогает.

Комментарии

в производительности на время разработки отключить всё кеширование, сбросить кеш, изменить css, СОХРАНИТЬ его и нажать ctrl+F5

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

Спасибо. Теперь нужно редактировать /sites/default/files/color/pixture_reloaded-11003de5/style.css

Но я хоть убейте, не могу понять, для чего нужен style.css находящийся в папке темы sites\all\themes\pixture_reloaded\style.css, ведь при его редактировании стиль темы не меняется.

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

Действительно) После изменений файла (в ручную или интерфейс) нужно просто сохранить конфигурацию в теме оформления. Спасибо Вам большое. Если честно, то я думал, что меня здесь просто обстебают.

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

при использования модуля color и изменении параметров темы, в теме создается новый css файл
тема крайне неудобная для изменений)

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

В этой теме, насколько я помню стили рекоммендуют править в файле pr.css. Так же в версии для шестерки, помоему, надо каждый раз после изменений пересохранять настройки темы.

На странице темы написано:
For the D7 version the colorable styles have been completely seperated, so its very easy to override without having to re-save the theme settings like the Drupal 6 version.

Я так, когда-то допер, что в шестерке пересохраняться надо;)

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

На развитие drupal.ru

Ваша финансовая помощь дает нам возможность оплачивать хостинг и поддерживать стабильную работу сайта. Благодарим за поддержку!

Трекер

Отмена стилей списков

После миграции отстутствует контент. Как выяснить почему?

Вакансия Drupal разработчик

Что значит: mysqldump: Error: &#039;Access denied; you need (at least one of) the PROCESS privilege(s) for this operation&#039;

Как произвести массовое редактирование товара

Не отображаются оплаты через робокассу на drupal 8 + commerse 2.0

Минимум элементов для отображения в views.

Entity cache + Redis / Entity cache + Memcache Могут ли работать вместе?

Как правильно установить библиотеку Blazy используя composer?

Тормозит сайт

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

Отмена стилей списков

После миграции отстутствует контент. Как выяснить почему?

Вакансия Drupal разработчик

Что значит: mysqldump: Error: &#039;Access denied; you need (at least one of) the PROCESS privilege(s) for this operation&#039;

Не отображаются оплаты через робокассу на drupal 8 + commerse 2.0

Минимум элементов для отображения в views.

Фильтр данных при вводе в View

webforms. Странное поведение хука

Количество товара в заказе не больше чем в остатках

Нужен специалист Drupal 9 (разработка сайта)

Содержимое сайта публикуется на условиях CreativeCommons Attribution-ShareAlike 3.0 или более поздней версии. Программные коды в тексте статей — на условиях GNU GPL v2 или более поздней версии.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *