Перезаписывание мобильного отзывчивого css темы canvas woo

Question

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

// For mobile devices 
@media only screen and (min-device-width : 320px) and (max-device-width : 480px){ 
     /* custom css ----------- */ 
} 
and so on for other devices 

Answer 1

Проблема, вероятно, что CSS вы пишете в child style.css не перезаписывает оригинальный файл style.css (который уже имеет размер шрифта).

Если включить! Важно для вашего CSS может исправить эту проблему, например, изменить

font-size: 14px; 

в

font-size: 14px !important; 

важно! Отменяет любой из других назначенных стилей для того. Это подход, который вы должны предпринять с дочерними темами AFAIK (с использованием! Важно перечеркнуть CSS), если вы не удалите исходный файл style.css (какой тип побеждает цель дочерних тем).

Answer 2

На самом деле, одним из основных преимуществ детской темы WordPress является то, что он может переопределять исходный style.css. Фактически, только необходимый файл в child theme является правильно написанным style.css.

Но одна проблема заключается в том, что Canvas иногда использует get_template_directory_uri(), который возвращает родительские стили темы, а не get_stylesheet_directory_uri(), который возвращает стили дочерних тем. Чтобы использовать стили ваших дочерних тем, вы можете изменить функции по мере необходимости в своей дочерней теме, в /includes/theme-actions.php. Я должен был сделать это для layout.css и non-responsive.css.

Использование !important в CSS often a bad idea.