Часто перед контент-менеджером стоит задача скопировать контент (текст и изображения) из какого-либо источника на наш сайт, проще говоря «скопипастить» контент (ctrl+c, ctrl+v). Те, кто занимался этим, знают, что в этом процессе есть пара рутинных моментов — удаление лишней html-разметки, которая могла присутствовать на сайте-источнике, а так же закачивание изображений на хостинг сайта-получателя. Сегодня мы рассмотрим, […]
16 сентября, 2017
More
Никто не любит визуально скучные сайты, никак не реагирующие на действия пользователя, например, наведение мыши на элемент. Ускорим процесс написания стилей для их реагирование на состояние блока используя Transition миксин.
23 июля, 2017
More
Использование сетки при разработки прототипа или макета сайта в последнее время стало обязательным условием. Для её создания создана масса инструментов, так же интернет пестрит подобными сервисами в огромном количестве. К сожалению, не все из них поддерживают дробные значения пикселей, что влечет за собой некоторую погрешность при генерации сетки с заданными параметрами. В определенный момент времени, […]
16 июня, 2017
MoreТипичная задача верстки: сделать секцию сайта с изображением в качестве бэкграунда. Весь блок должен быть адаптивным и полностью перекрыт изображением, без искажения самого изображения.
23 апреля, 2016
MoreНе использовать свойство columns у <ul>, <ol>. Съедает маркеры. Применять к родительскому элементу; Overflow: hidden плохо работает у таблиц (и display: table); Position: absolute делает элемент блочным, за исключением элементов с display:table; To be continued…
7 октября, 2015
MoreСуществует проблема скачков страницы сайта после её открытия из-за последующей загрузки изображений. Особенно это заметно, если пролистать страницу, насыщенную изображениями, до конца и обновить её. Конечно же, можно указать фиксированные размеры изображения, однако в таком случае мы сильно потеряем в адаптивности страницы.
22 августа, 2015
MoreНекоторые важные моменты, касающиеся верстки, собранные из популярных источников, практики и собственного опыта. Подробнее
15 августа, 2015
MoreЗадача: оформить dl-список так, чтобы термины и определения были по левую и правую сторону соответственно. При этом необходимо учесть возможность присутствия двух или более терминов, а так же двух или более определений. Less/Scss/Stylus
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | .dl-horizon { dt { float: left; clear: left; margin-right: 1em; } dd { text-align: right; &:after { content: ""; display: block; clear: both; } } } |
Css
1 2 3 4 5 6 7 8 9 10 11 12 13 | .dl-horizon dt { float: left; clear: left; margin-right: 1em; } .dl-horizon dd { text-align: right; } .dl-horizon dd:after { content: ""; display: block; clear: both; } |
16 июля, 2015
More