Статьи - страница 2

Что может сломать CSS свойство aspect-ratio

alexei12/12/2024 - 08:33

В CSS есть свойство aspect-ratio, которое получило полную поддержку примерно в 2021 году. Это свойство дает гораздо лучший дизайнерский результат, чем принудительное изменение размеров. Однако, у него есть и свои особенности использования, незнание которых может привести к некоторым проблемам

Разрешите представиться, Каскадные слои CSS

alexei09/10/2024 - 08:31

Чтобы преодолеть проблемы с каскадом и специфичностью, нам нужно быть осторожными с тем, где писать конкретный блок кода CSS. В этой статье мы рассмотрим, как работают каскадные слои, и как они помогут нам писать код CSS с большей уверенностью, что он будет работать так, как нам нужно

Что такое медиаобъект? Еще один кирпичик вашего сайта

alexei19/09/2024 - 08:51

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

Секрет эффективного CSS? Соблюдайте модульность!

alexei10/09/2024 - 20:26

Включение CSS и HTML в абстракции, обрабатываемые на сервере, в конечном итоге ведет к значительному раздуванию кода, потому что CSS и HTML требуют гораздо более модульной структуры объектов, чем, например, PHP

Как структурировать CSS? Разбираемся в синтаксисе БЭМ

alexei30/08/2024 - 09:14

БЭМ (Блок, Элемент, Модификатор) - это методология именования селекторов CSS, придуманная ребятами из Яндекса. Это разумный способ присвоения имен вашим CSS классам, чтобы придать им больше прозрачности и смысла для других разработчиков

Как структурировать CSS? Знакомьтесь - BEM

alexei24/08/2024 - 08:37

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

Тестирование кода HTML при помощи CSS

alexei18/08/2024 - 08:33

Мы поговорим о том, можно ли тестировать HTML при помощи возможностей CSS (тестирование целостности HTML с использованием CSS-селекторов) без использования JavaScript, и что могут предложить последние новшества самого CSS

Каскад и специфичность в CSS - это просто

alexei08/08/2024 - 08:51

Каскад и специфичность часто воспринимаются как что-то сложное и запутанное. И в самом деле, если вы не учитываете их в своем коде CSS, это очень быстро приведет к проблемам. Но если у вас есть хотя бы базовые знания в этом вопросе, все становится довольно просто

Эффект размытия вместо тени на CSS

alexei27/04/2024 - 09:06

Черпая вдохновение в тенях, автор статьи Яир Эвен Ор (Yair Even Or) создает нечто подобное, только с эффектом размытия вместо тени. В этой статье вы получите пошаговое объяснение того, как это делается с помощью комбинации масок, градиентов и старого доброго свойства backdrop-filter

Как анимировать контур при помощи CSS

alexei12/02/2024 - 09:47

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

CSS тени и Неоморфный дизайн

alexei29/01/2024 - 09:41

Неоморфизм, также известный как мягкий дизайн пользовательского интерфейса, - это направление дизайна, которое подразумевает создание 3D-подобных обтекаемых или мягких фигур с помощью CSS теней. В этой статье мы рассмотрим, как добавить различные типы теней к блочным элементам и тексту.

Крутые эффекты наведения, основанные на свойстве background

alexei15/12/2023 - 09:37

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

Необычные украшения изображений - Магия с одним элементом

alexei29/10/2023 - 09:22

Как следует из названия, мы собираемся украшать изображения! При этом мы будем украшать изображение, используя только тег img и ничего больше. Всю работу возьмет на себя CSS

Отблеск, перспектива и поворот - CSS 3D-эффекты для изображений

Отблеск, перспектива и поворот - причудливые CSS 3D эффекты для изображений

alexei13/09/2023 - 09:26

CSS, используя определенные приемы, позволяет превращать изображения в аккуратные интерактивные элементы. Эта статья представляет собой сборник необычных 3D-эффектов для изображений, демонстрирующих эти возможности CSS

Создаем часы при помощи новых тригонометрических CSS функций sin() и cos()

alexei26/08/2023 - 10:03

Ну вот, наконец, у нас есть тригонометрические CSS функции! Наличие такого рода математических способностей CSS открывает целый ряд новых возможностей. И вот, в этом уроке мы пощупаем эти возможности и познакомимся с парой новых функций: sin() и cos().