Сайт перешел на функционал групп
Читаем новость, обсуждаем, делимся впечатлениями или может есть какие пожелания? Перейти
23 июня 2019 в 11:37
Владимир Otshelnik-Fm
на сайт, и вы сможете вступить в группу.
Вы сможете подписаться на выход новых материалов группы.
Вы сможете подписаться на новые комментарии к выбранной записи группы.

CSS и инструменты разработчика в браузере. Урок №3

В этом уроке у нас будет практика с реальными примерами. И рассмотрим некоторые хитрости в борьбе за свои стилевые правила.

Итак:
Мы уменьшим обложку в личном кабинете который выводится WordPress плагином WP-Recall.
Мы зададим размер h3 в виджете. И сделаем это выборочно - чтобы не задеть другие подзаголовки h3
Мы перебьем inline CSS - рассмотрим пару вариантов.
Мы подкорректируем размер кнопки - и при этом не затронем другие такие же кнопки в других местах.

Вы увидите на примере body-тега как можно использовать его удобные классы, которые меняются в зависимости от условий и страниц - для более тонкой подстройки css правил.

Урок №3

- уменьшим обложку
- h3 размер
- inline css
- правим только нужное

css и инструменты разработчика в браузере

 

Timeline:

1. Пример 1. Уменьшим высоту обложки 0:29
2. Пример 2. Изменим шрифт h3 - и увидим что порядок загрузки css важен 3:25
3. Пример 3. inline css - body всему голова, а !important - не так и важен 6:44
4. Пример 4. Стили только для одной страницы. body всему голова. Снова! p.s. на правильной WordPress теме 9:09

Плагин Simple Custom CSS

По всем вопросам - жду в комментариях

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

Оставьте комментарий

Авторизация
*
*
Регистрация
*
*
*
Настоящим подтверждаю, что я ознакомлен и согласен с условиями политики конфиденциальности
Генерация пароля
Написать
*
*