CSS загружен, но не применяется

#html #css #wordpress #localhost #enqueue

#HTML #css #wordpress #localhost #очередь

Вопрос:

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

В WordPress я заметил, что основной файл style.css не применяется, в частности:

  • Файл загружен правильно
  • Его стили НЕ применяются

Когда я проверяю элемент на предмет элемента, который, как я знаю, нацелен на style.css, ничего из style.css там нет (вкладка styles элемента inspect) вообще. Я проверил несколько элементов.

Он загружается через WordPress как таковой (неизмененный вызов, сгенерированный с помощью _underscores):

 wp_enqueue_style( 'themexzz-style', get_stylesheet_uri(), array(), _S_VERSION );
  

Это созданная ссылка (и нажатие на нее работает так, как должно):

 <link rel='stylesheet' id='themexzz-style-css'  href='http://localhost:8012/themexzz/wp-content/themes/themexzz/style.css?ver=1.0.0' media='all' />
  

Я использую

  • Xampp с php 7.2.3
  • с WordPress 5.5.3
  • meta charset=»UTF-8″
  • Параметры сортировки базы данных — utf8mb4_unicode_ci
  • Это тема, созданная с подчеркиванием

Заранее спасибо.

Комментарии:

1. Пожалуйста, покажите свои CSS-коды

2. Этого недостаточно, чтобы уйти отсюда. Есть вероятность, что вы видите кэшированную версию, есть вероятность, что ваш браузер блокирует ее как небезопасный ресурс, у вас может быть неверный способ CSS в начале этого файла, блокирующий все остальные применяемые CSS и т. Д.

3. Я согласен с @Xhynk, мы не можем воспроизвести проблему удаленно. Вы можете дважды проверить с помощью Chrome Dev Tools и увидеть «Вычисленные» стили для определенного элемента.

Ответ №1:

@Xhynk — Вы были правы. Это был:

возможно, у вас неверный путь CSS в начале этого файла, блокирующий все остальные применяемые CSS

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

Спасибо @Xhynk

Ответ №2:

Положение файлов CSS в теге head также имеет значение, предположим, что вы загрузили 2 файла CSS в тег head

 <link rel='stylesheet' href="..../style.css"> 
<!--(have property of background color blue and text white)-->
<link rel='stylesheet' href="..../mycss.css">
<!--(have property of background color white and text black)-->
  

если вы размещаете теги в таком порядке

 <head>
<link rel='stylesheet' href="..../style.css"> 
<link rel='stylesheet' href="..../mycss.css">
</head>
  

Оба файла будут загружены, но CSS будет применен к файлу myss.css,
это происходит из-за перезаписи CSS

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