Архив меток: CSS 3

Фокус на front-end: темный режим

От автора: когда мы переходим в 2020 год, у Front-end разработчиков появилась еще одна отличная возможность в наборе функций веб-приложений, с которым нам приходится сталкиваться. Адаптивность для мобильных устройств, планшетов и настольных ПК Поддержка различными браузерами (устаревшими и другими) Проблемы доступности Прогрессивные веб-приложения SEO Оптимизация производительности т. д. и т. п. Теперь у нас есть Dark Mode (темный режим). Может ...

Читать далее »

Тренды CSS 2019: Полное руководство

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

Читать далее »

Используйте CSS Grid в производстве — сегодня

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

Читать далее »

Синтаксис свойства CSS Display с двумя значениями

От автора: если вам нравится читать примечания к релизам, то вы, возможно, заметили в примечаниях Firefox 70 строку, относящуюся к реализации синтаксиса с двумя значениями для свойства CSS display. Или, может быть, вы встретили упоминание о нем во вчерашнем обзоре Firefox 70. Сегодня я объясню, что это значит, и почему понимание этого синтаксиса важно, несмотря на то, что сейчас он ...

Читать далее »

7 единиц измерения CSS, о которых вы могли не знать

От автора: сегодня я собираюсь познакомить вас с некоторыми инструментами CSS, о которых вы, возможно, не знали раньше. Эти инструменты представляют собой единицы измерения, например, пиксели или em, но вполне возможно, что о некоторых вы никогда не слышали! Давайте начнем. Работая с методами CSS, которые мы хорошо знаем, можно застрять, когда появляются новые проблемы. Поскольку Веб продолжает развиваться, спрос на ...

Читать далее »

Как создать всплывающее окно обратной связи на чистом CSS

От автора: в этом супер-коротком руководстве мы рассмотрим процесс создания всплывающего окна обратной связи. Мы не будем использовать JavaScript, на самом деле мы создадим форму, воспользовавшись «техникой хака чек-боксов CSS». Звучит интересно? Вот что мы будем создавать: 1. Начинаем с разметки страницы Мы начнем с чек-бокса вместе с его меткой и формой. В форме мы поместим некоторые общие элементы ввода. ...

Читать далее »

Круги в CSS

От автора: я постоянный эксперт Cloud Four по кругам. Я не планировал им быть. Некоторое время назад мы работали над проектом, в котором было много кругов: круглые контейнеры, круглые миниатюры, круглые кнопки. И сначала я стал парнем, с которым можно поговорить, если у вас возникли проблемы с кругами и CSS. Но я открою вам секрет: в этом нет ничего сложного. ...

Читать далее »

Создание макета настенного альбома с помощью CSS Grid

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

Читать далее »

Современный сброс CSS

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

Читать далее »

Создание слайд-шоу с помощью CSS Scroll Snappin

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

Читать далее »