CSS и инструменты разработчика в браузере. Урок №3
В этом уроке у нас будет практика с реальными примерами. И рассмотрим некоторые хитрости в борьбе за свои стилевые правила.
Итак:
Мы уменьшим обложку в личном кабинете который выводится WordPress плагином WP-Recall.
Мы зададим размер h3 в виджете. И сделаем это выборочно - чтобы не задеть другие подзаголовки h3
Мы перебьем inline CSS - рассмотрим пару вариантов.
Мы подкорректируем размер кнопки - и при этом не затронем другие такие же кнопки в других местах.
Вы увидите на примере body-тега как можно использовать его удобные классы, которые меняются в зависимости от условий и страниц - для более тонкой подстройки css правил.
Урок №3
- уменьшим обложку
- h3 размер
- inline 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
По всем вопросам - жду в комментариях
