#php #css #wordpress
#php #CSS #wordpress
Вопрос:
Поэтому я пытался добавить новый класс css к определенной функции на веб-сайте. Для этой функции она уже подключена к уже созданному классу CSS в файле style.css, имея имя класса css внутри div функции. Однако, когда я иду, чтобы создать новый класс css и добавить его в style.css/заменив имя класса в div функции, он не отображается на веб-сайте. Однако, когда я использую старый класс, к которому также была подключена функция, и ввожу это имя в div функции, отображается старый css. Я очистил весь свой кэш и обновил медиа-запрос. Я также перезагрузил свой компьютер, но безуспешно. Мне было интересно, как подойти к этому вопросу и есть ли у кого-нибудь какие-либо рекомендации?
Спасибо!
Вот как выглядит мой код прямо сейчас и который отображается на сайте:
lt;div class="water-bottle water-square"gt;.....lt;/divgt;
CSS
.water-bottle { width: calc(50% - 15px); min-height: 15.5em; text-align: center; display: flex; flex-direction: column; align-items: center; font-size: 20px; color: #fff; padding-left: 50px; padding-right: 50px; padding-top: 40px; padding-bottom: 40px; border-radius: 16px; position: relative; }
Это то, что я тоже изменяю, и оно не отображается:
lt;div class="water-bottle-pop water-square"gt;.....lt;/divgt;
CSS
.water-bottle-pop { width: calc(50% - 15px); min-height: 1.5em; text-align: center; display: flex; flex-direction: column; align-items: center; font-size: 20px; color: #fff; padding-left: 20px; padding-right: 20px; padding-top: 10px; padding-bottom: 40px; border-radius: 16px; position: relative; }
Комментарии:
1. Откройте инструменты разработки, перейдите в его настройки и убедитесь, что установлен флажок «отключить кэш HTTP, когда инструменты разработки открыты» (или с аналогичным именем). Затем перезагрузите, сохраняя инструменты разработки открытыми (которые в любом случае всегда должны быть открыты во время работы разработчика =)
2. Привет, на ваш вопрос трудно ответить без контекста, не могли бы вы опубликовать здесь какой-нибудь код, пожалуйста? Либо вам нужно удалить кэш, либо у вас отсутствует файл css, либо ваши классы в этом файле неправильно отформатированы.
3. Мое лучшее предположение: проблема с кэшированием. Попробуйте нажать CTRL F5 после изменения CSS.
4. Привет, @Майк, я попробовал твой метод проверки флажка, и это, к сожалению, не сработало
5. @JohnStewart Правильно посмотрите на имена классов в CSS и Html
Ответ №1:
Both are working well, if you want, you can try running both together.
/*.water-bottle { width: calc(50% - 15px); min-height: 15.5em; text-align: center; display: flex; flex-direction: column; align-items: center; font-size: 20px; color: #fff; padding-left: 50px; padding-right: 50px; padding-top: 40px; padding-bottom: 40px; border-radius: 16px; position: relative; border:2px solid red; }*/ .water-bottle-pop { width: calc(50% - 15px); min-height: 1.5em; text-align: center; display: flex; flex-direction: column; align-items: center; font-size: 20px; color: #fff; padding-left: 20px; padding-right: 20px; padding-top: 10px; padding-bottom: 40px; border-radius: 16px; position: relative; border:2px solid black; }
lt;!--lt;div class="water-bottle water-square"gt;.....lt;/divgt;--gt; lt;div class="water-bottle-pop water-square"gt;.....lt;/divgt;