CSS-свойства, единицы измерения, селекторы, приоритеты, переменные, анимация, техники и подходы, используемые для оформления html-страниц
Анимация типа @keyframes + свойство animation позволяют сделать анимированный логотип или баннер, красивый слайдер или выпадающее меню. Для того чтобы облегчить процесс создания самой анимации, […]
Шрифт в английском языке переводится как font или type. Первый вариант перевода мы будем использовать для различных css-свойств, которые позволяют управлять шрифтами на html-странице, а […]
CSS-свойства для текста, как правило, начинаются с приставкой text- или word-, и предполагают работу с текстовыми блоками с точки зрения форматирования текста. Здесь речь идёт […]
Радио-кнопки подразумевают, что вы выбираете один элемент из некоторого количества, поэтому элемент <input type=»radio»> получил название переключателя в отличие от флажков, которые подразумевают множественный выбор. […]
Наверняка вы задумались о том, как можно изменить стандартный вид флажков (чекбоксов), чтобы они выглядели привлекательней с учетом дизайна вашего сайта или задач одной конкретной […]
Наверняка вы посещали страницы, которые плавно прокручивают контент при клике на ссылке к соответствующему блоку. Это красиво выглядит на лэндингах (LandingPage, или посадочная страница), в […]
Центрирование элементов в css — это совсем не праздный вопрос, т.к. это довольно распространенная ситуация в верстке. В этой статье мы рассмотрим разные способы горизонтального […]
Мы рассмотрим варианты построения макета на основе 4 колонок. Во-первых, такое распределение информации является очень популярным, во-вторых, они хорошо перестраиваются в 2 колонки для планшетов […]
В этой статье мы увидим, как сделать не просто кнопки, а кнопки-иконки, доступные для людей с ограниченными возможностями, с помощью SVG и CSS, не перегружая […]
При создании веб-сайтов и веб-приложений периодически требуется показать пользователю информацию о ходе выполнения какого-либо запроса или задачи, будь то загрузка файла, воспроизведение видео или импорт […]
Обычно нам требуется задать некое форматирование для классов, элементов или id. Однако, бывают случаи, когда нужно назначить форматирование для элементов, которые не имеют какого-либо селектора, […]
Вы когда-нибудь задумывались о том, что на HTML и CSS можно сделать книгу? Оказывается, есть умельцы, выкладывающие свои работы на codepen.io, которые с помощью 3D […]
В этой статье вы найдете подборку примеров кода с ресурса codepen.io, которые предлагают интересные решения с точки зрения дизайна и кода для таких блоков вашего […]
К Новому году хочется чего-то красивого и праздничного: фейерверков, подарков, хорошего настроения и немного анимации. В этой статье собраны примеры с ресурса codepen.io, которые подарят […]
Что такое CSS-фреймворки? Это, как правило, созданные одним или чаще несколькими разработчиками css-классы, которые облегчают для вас процесс верстки, собранные в одном файле. Подключив всего […]
Overlay (оверлей), или перекрывающий слой — это слой, который обычно накладывают поверх фонового изображения для того, чтобы затемнить или осветлить его. Дизайнеры в макетах обычно […]
Переменные в CSS или на английском CSS Custom Properties, что в переводе звучит, как пользовательские свойства CSS, — это специальные css-свойства, которые позволяют изменять значения […]
HTML-теги figure и figcaption появились в стандарте HTML5 для формирования блока с картинкой и описания к ней. Кроме того, эти теги можно применять для оборачивания […]
