От автора: за 20 лет опыта веб-разработки я создал для себя стандартный подход CSS, которым я хотел бы поделиться в этой статье. В этом примере показан мой структурный подход, а не дизайн. Таким образом, статья не является визуальным шаблоном и не имеет дизайна. В общем, я использую rem как единицу измерения для всех размеров, кроме границ, для которых я использую ...

От автора: при разработке программного обеспечения важно согласовать инструкции, технологии и методологии. Эти соглашения должны быть результатом обсуждений, проверки концепций, знаний, а иногда и голосований. К участию следует приглашать всю команду, потому что разработка программного обеспечения — это командная работа. В visuellverstehen мы разделены на несколько команд. Некоторые команды согласились использовать Блок-элемент-модификатор (BEM), а другие команды согласились использовать Tailwind CSS. ...

От автора: в CSS каждое свойство должно иметь какое-то значение. Иногда это путь, иногда цвет, иногда строка, а иногда единица измерения. Сегодня мы говорим о единицах CSS для измерения длины, ширины и высоты элемента. Есть много CSS единиц, которые могут быть использованы для измерения, например: px, em, rem, vh, vw и т.д. Мы можем разделить все эти единицы на две ...

От автора: некоторое время назад я изучал домашнюю страницу facebook.com, чтобы узнать и разобраться, как она построена. Мне всегда любопытно посмотреть, как люди пишут CSS. Я заметил очень и очень интересное значение border-radius для карточного компонента в основной ленте. И поделился следующим твитом об этом открытии. Затем, я получил такой ответ от Мириам Сюзанн: всегда ли это 8 пикселей? Для ...

От автора: понимание размеров в CSS необходимо разработчикам, которым нужна гибкость для правильного представления содержимого веб-страницы. В CSS мы определяем размер элемента, используя значения длины (px, em), процентов и ключевых слов. Хотя типы значений длины и процентного значения часто используются для макетов веб-страниц, они не всегда идеально подходят. Иногда мы используем ключевые слова, такие как fit-content, min-content и max-content. В ...

От автора: в этом уроке вы познакомитесь с отличным сервисом IcoMoon, который предлагает огромное количество шрифтовых иконок. Думаю, все вы в своих проектах использовали иконочные шрифты, например, наиболее известный – Font Awesome. Сервис IcoMoon предлагает не менее качественные шрифтовые иконки и в большом количестве. Читайте нас в Telegram, VK, Яндекс.Дзен

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

От автора: да, еще один пост о загрузчиках CSS, но на этот раз вы создадите загрузчик! В этой статье я поделюсь с вами несколькими приемами, которые я использую при создании своих загрузчиков. Существует множество техник создания точек загрузки. Я остановлюсь на своем любимом — radial-gradient и фоновой анимации. Что ж, еще один скучный урок, в котором у нас будет куча ...

От автора: с годами CSS-фреймворки стали невероятно распространенными в веб-дизайне: эстетика Google Material Design постепенно проявляется в Сети, а библиотека плагинов и тем Bootstrap становится популярной по умолчанию. Хорошая новость в том, что времена, когда страницы выглядели так: … давно прошли, отчасти благодаря фреймворкам CSS. Но, как и многие другие люди, вы можете спросить, что я могу использовать, что еще ...

От автора: возможно, вы уже знаете о свойстве CSS gap. Оно не совсем ново, но в прошлом году это свойство получило новую важную возможность: теперь оно работает во Flexbox в дополнение к CSS Grid. Это, а также тот факт, что я считаю свойство более сложным, чем кажется, заставили меня объяснить, как именно оно работает. Давайте внимательно рассмотрим gap и связанные ...