Как сделать колонки одинаковой высоты

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

Приёмы создания плавной анимации

Современные интернет-пользователи хотят, чтобы открываемые страницы были интерактивными и работали плавно. Страницы должны не только быстро загружаться, но и хорошо работать: прокрутка…

Создание HTML форм

HTML формы — сложные элементы интерфейса. Они включают в себя разные функциональные элементы: поля ввода <input> и <textarea>, списки <select>, подсказки и…

Рисуем с помощью box-shadow

Свойство box-shadow — удивительное свойство. Оно позволяет создать множество теней вокруг одного элемента. С его помощью можно рисовать как простые, так и…

Анимированные переходы

Анимированные переходы — альтернатива несложной анимации. С помощью CSS3 переходов можно изменять различные характеристики одного элемента одновременно, устанавливая задержку во времени для…

Индикатор загрузки для сайта

Урок посвящён созданию оригинального индикатора загрузки для сайта с использованием простых css-фигур и анимации, базирующейся на трансформации элементов. Такой индикатор можно использовать…

Красивые заголовки

В этом уроке я предлагаю вам несколько идей для ваших текущих и будущих проектов. Вы узнаете, как создавать красивые заголовки для сайта,…

Всплывающая подсказка с помощью CSS

В этом уроке вы узнаете, как сделать всплывающую подсказку при наведении на кнопку с помощью CSS. Текст всплывающей подсказки будет генериться за…

Просто! Создать! Веб-сайт!

(Перевод статьи Just! Build! Websites! (в ред. автора) Ведущим подкаста ShopTalk Крису Койер (Chris Coyier) и Дейву Руперт (Dave Rupert) часто задают…

Псевдоклассы

Псевдоклассы описывают характеристики элементов, такие как динамическое состояние — нажатая ссылка, язык кодировки — абзац на французском языке и т.д. Они не…

Градиент для текста

Градиент для текста — технология экспериментальная, поддерживается только в браузерах на основе WebKit-движка. Тем не менее, этим приёмом можно свободно пользоваться, а…

Идеи для оформления заголовков на сайте

Заголовки на сайте должны привлекать внимание. По умолчанию в браузере для них установлен увеличенный размер шрифта и полужирное начертание. Данные примеры подходят…

bxSlider — установка, настройки, примеры

Перейти на страницу с примерами Плагин bxSlider — отзывчивый jQuery-слайдер для контента. Наличие большого количества настроек позволяет адаптировать слайдер под конкретные нужды…

Горизонтальное выпадающее многоуровневое меню

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

Шпаргалка по работе с таблицами

1. Как задать таблице класс или идентификатор Если на одной странице или на сайте присутствует несколько таблиц и для них требуется установить…

Поле поиска для сайта. Идеи для оформления

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

Отзывчивый и адаптивный дизайн сайта

Интернет-пользователи просматривают сайты на разных устройствах с экранами различных размеров. Размеры экранов постоянно меняются, поэтому важно чтобы сайт адаптировался к любому из них.…