Верстка \ CSS 3

Использование адаптивных модификаторов для управления изменениями компоновки в компонентах

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

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

Верстка \ CSS 3

Пиксели или относительные единицы в CSS: почему это все еще важно

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

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

Верстка \ CSS 3

Создаем резюме на основе Grid

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

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

Верстка \ CSS 3

Помощь браузерам в оптимизации с помощью свойства CSS contain

От автора: свойство CSS contain дает возможность объяснить макет браузеру, чтобы можно было оптимизировать производительность. Тем не менее, это связано с некоторыми побочными эффектами с точки зрения макета.

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

Верстка \ CSS 3

Flash Grid: Изучите CSS Grid, построив систему сетки

От автора: в последнее время я экспериментировал с идеей создания облегченной системы сетки на основе CSS Grid. У нас в CodyFrame есть система сетки, и она основана на Flexbox. Однако CSS Grid имеет так много мощных функций, которых нет во Flexbox, что я в итоге создал Flash Grid.

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

Верстка \ CSS 3

Использование easing не только для CSS-переходов

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

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