От автора: история замены изображений в CSS довольно насыщена и разнообразна. Если вы заинтересованы данной тематикой, то в сети можно найти множество современных техник по замене изображений. Важно отметить тот факт, что в скором будущем Google будет наказывать владельцев сайтов за использование отдельных техник, если уже не делает этого. Так что к этому вопросу стоит подходить с осторожностью. Однако вы никогда точно не сможете предугадать, когда ваша CMS или проект заставят вас воспользоваться данным инструментарием! В этой статье мы собрали все известные методики по замене изображений, которые вам могут еще пригодиться, пока интернет не ушел далеко вперед.

Продолжить чтение →

От автора: в этой статье вам не нужно знать все тонкости Flexbox, чтобы приступить к созданию макета новостного сайта. В процессе создания новостного сайта мы узнаем про несколько функций Flexbox, которые можно встретить на сайте Guardian.

Продолжить чтение →

От автора: веб-сайты имеют преимущественно прямоугольную форму, а вот печатные СМИ не ограничены только лишь прямоугольником. Разница кроется во множестве причин, одна из которых это отсутствие подходящих инструментов. В этом уроке вы узнаете про свойство clip-path, с помощью которого можно кадрировать изображения. Видимая область задается с помощью специальных значений. Мы начнем с основных моментов, рассмотрим синтаксис и затем перейдем на более продвинутые концепции.

Продолжить чтение →

От автора: главная задача прилипающего футера «прилипать» к нижней части окна браузера. Если на странице много контента, то футер должен прилипать строго к нижней границе экрана. Если же контента слишком мало, чтобы пододвинуть футер вниз, опять же требуется его туда опустить.

Продолжить чтение →

От автора: добро пожаловать во вторую часть этой небольшой серии статьей, посвященной «началу конца» того, что сообщество разработчиков называет oldIE (т.е. IE вплоть до версии 10). В первой статье были представлены устаревшие техники и практики, от которых уже можно отказаться для упрощения процесса front-end разработки. Статья вызвала довольно интересную дискуссию в комментариях, что побудило меня добавить дисклеймер (который следовало бы добавить и в первую статью задним числом).

Продолжить чтение →

От автора: друзья, приветствую! Наверное, многие слышали термин pixel perfect верстка. Pixel perfect верстка — это верстка, при которой итоговая html страница и исходный PSD макет полностью, до каждого пикселя, совпадают. Если с самим термином все понятно, то с вопросом «Как реализовать попиксельную верстку?» или «Как сравнить верстку и исходный макет?» могут возникнуть сложности. В данном уроке мы рассмотрим плагин, который позволяет быстро и удобно делать попиксельную верстку.

Продолжить чтение →

От автора: изучая HTML5 и осваивая все новые техники, вы, скорее всего, захотите создать себе базовый шаблон, с которого можно будет начать любой HTML5-проект. Мы поддерживаем ваше желание.

Продолжить чтение →

От автора: почти во всех языках программирования есть типы данных, и Sass не исключение. Тип данных – это способ классификации данных по определенным категориям для различных целей. К примеру, 2 – это тип number, а SitePoint – тип string. В этой статье я расскажу вам про все семь типов данных в Sass, а также покажу пример использования каждого типа данных.

Продолжить чтение →

От автора: приветствую вас, уважаемый читатель. Сегодня мы с вами попробуем сделать слайдер на css3. Еще несколько лет назад такое было попросту невозможно, сегодня же это можно сделать абсолютно без помощи javascript, хотя и с некоторыми оговорками. В общем, изучайте. Тут же можно скачать исходник, чтобы посмотреть, как оно работает.

Продолжить чтение →

От автора: если вы уже во front-end разработке хотя бы пару лет, вы, скорее всего, уже использовали CSS-хаки. Однако если вы еще новичок, вы могли слышать данный термин, но до конца не понимаете его значение. В этой статье я объясню, что такое CSS-хак, и как им пользоваться. Но сначала я объясню, почему решил написать эту статью.

Продолжить чтение →