Использование Inspect Element (Инструменты разработчика)

 
Чтобы настроить каждый раздел Modern Events Calendar вручную вы можете использовать инструменты разработки в своих браузерах, а затем поместить пользовательские коды в поле «Пользовательский CSS» в настройках MEC или вашей темы.

Напишите собственный CSS-код

Вы можете использовать Inspect Element (встроенные инструменты разработчика вашего браузера) и изменить каждый раздел под себя:

Если вы хотите внести изменения в свой дизайн, вы можете использовать Inspect Element (инструменты разработки), чтобы просмотреть исходный код вашего веб-сайта и примененные к нему правила CSS.

Чтобы получить к нему доступ, щелкните правой кнопкой мыши и в появившемся меню выберите «Проверить элемент» (или «Проверить» или «Инструменты разработчика»).

Для получения более подробной информации вы можете посетить элемент проверки Chrome или элемент проверки Firefox. Между тем, поиск в Google тоже будет полезен.

Например, мы пытаемся изменить цвет нижней серой границы в нижнем колонтитуле.

Вот несколько руководств по CSS, которые помогут вам писать собственный CSS-код: w3schools | CSS Units

Медиа-запросы для всех устройств

Вы можете использовать «медиа-запрос», чтобы сделать ваш дизайн более отзывчивым на мобильных и планшетных устройствах. Нажмите здесь или здесь, чтобы получить дополнительную информацию о медиазапросах CSS.

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

@media only screen and (max-width: 480px) {
    /* PUT YOUR CSS CODE */
}

или используйте между двумя размерами экрана:

@media (max-width: 960px) and (min-width: 481px){
    /* PUT YOUR CSS CODE */
}

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

single-mec-events

or

 mec-single-fluent-body