DIV на всю высоту родителя

DIV на всю высоту родителя

Изящное CSS решение чтобы сделать высоту блока равной высоте его родительского блока. Применяется в том случае когда высота родительского блока не задана фиксировано, и определяется контентом внутри него.

Читать далее

Обучение верстке сайтов HTML5/CSS3 – Продолжается!

Анонс курса по обучению HTML5 / CSS3 с нуля до профи

Этим летом я стартовал курс по обучению верстке сайтов. Уже прошло два потока. Программа курса прошла проверку боем, и должен сказать что мой опыт меня не подвел. Студенты которые приходили с нуля, теперь могут верстать современные сайты. Адаптивность, отображение на мобильных устройствах, responsive menu, выпадающее меню, слайдеры, фреймворк twitter bootstrap не вызывают проблем. Сейчас я готовлю программу для третьего потока обучения. В основе она останется такой же как и была, но я хочу сделать ее еще лучше, настолько, насколько это возможно.

Читать далее

Сниппеты в Sublime Text. Как создать сниппет. Полная инструкция

Сниппеты в Sublime Text. Как создать сниппет. Полная инструкция

Сниппеты — это готовые блоки кода, которые часто используются при создании html разметки, css стилей, программного кода, и так далее. Использование сниппетов значительно сокращает время на написание кода, так как вы начинаете использовать заготовки прямо из редактора. Если вы используете расширение Emmet в Sublime Text — то вероятно знакомы со сниппетом который создает html разметку с doctype html5 при наборе знака ! и нажатии клавиши TAB. В этой статье мы разберемся подробно как создать свой сниппет в Sublime Text 2.

Читать далее

Кроссбраузерность HTML страниц: зачем нужны reset.css и normalize.css

Кроссбраузерность HTML страниц: зачем нужны reset.css и normalize.css

Чтобы страница одинаково хорошо отображалась в разных браузерах, необходимо работать над ее кроссбраузерностью. В этом нам помогает тестирование страницы и отладка html/css разметки. Но есть инструменты, которые помогут сократить наведение порядка в стилях, и добиться того чтобы базовые стили были одинаковы в разных браузерах. Что это за инструменты, зачем и как их использовать — рассмотрим далее.

Читать далее

30 CSS-селекторов, которые вы должны знать

30 CSS-селекторов, которые вы должны знать

Поговорим о CSS селекторах. Помимо обычного обращения к элементам через имя класса, id и название html тегов, можно использовать специальные комбинации и команды. Рассмотрим их в статье подробнее. Некоторые селекторы поддерживаются всеми браузерами, некоторые только самыми новыми версиями браузеров.

Читать далее

Как ускорить сайт на WordPress в 17 раз. Пошаговая инструкция

Как ускорить сайт на WordPress. Как я ускорил загрузку своего сайта в 17 раз

Представляю наиболее полную инструкцию с способами по ускорению работы сайта на WordPress. Благодаря описанным ниже способам я ускорил загрузку своего сайта с 24,40 секунд до 1,41 секунды. Увеличил скорость загрузки в 17,3 раза! Хороший результат. Чтобы узнать как — читайте полную статью.

Читать далее

Нестандартные веб шрифты в верстке. Google fonts и webfont

Нестандартные веб шрифты в верстке. Google fonts и webfont. Инструкция

В этом уроке мы разберем как подключать веб-шрифты в верстку. Веб-шрифты — это дополнительные гарнитуры шрифтов, которые используются чтобы сделать дизайн более уникальным или разнообразным. Подключение шрифта на странице — обеспечивает его корректное отображение во всех браузерах, и не важно установлен ли он у пользователя или нет.

Читать далее

Как задать свои стили оформления текста в редакторе WordPress

Как задать свои стили оформления текста в редакторе WordPress

Допустим вы создаете свою WordPress тему. С внешними стилями сайта все понятно, пишем в css файл и подключаем в шаблоне. А вот как сделать чтобы стили контента в админке, при редактировании постов и страниц — были такими же как и на сайте? Для этого есть специальная функция add_editor_style()

Читать далее

Сокращения в Emmet — справочник. Ускоряем верстку

Сокращения в Emmet - справочник. Ускоряем верстку

Emmet может очень сильно упростить и ускорить процесс написания HTML разметки. В этом посте я поделюсь своими наиболее часто используемыми сокращениями и полным списком HTML сокращений в Emmet для Sublime Text, и других редакторов кода.

Читать далее