Примеры страниц с ошибкой 404 с codepen
Как известно, на codepen.io можно найти массу красивых и полезных примеров с кодом HTML / CSS / JavaScript / jQuery / React и т.п. Сегодня […]
Последние записи: CSS
CSS-свойства, единицы измерения, селекторы, приоритеты, переменные, анимация, техники и подходы, используемые для оформления html-страниц
Подключение TailwindCSS в проект React Vite
Когда вы создаете проект React-Vite и планируете подключить TailwindCSS, вам следует обязательно обратить внимание на версию TailwindCSS. В зависимости от этой версии вам нужно будет […]
Используем фреймворк Tailwind CSS
Tailwind CSS на данный момент обгоняет по популярности все остальные CSS-фреймворки. По своей сути это utility-first CSS-фреймворк. В отличие от Bootstrap или Bulma, он не […]
Функции в CSS для управления цветом
Функции в CSS — это, с одной стороны уже привычные способы назначения цвета или получения url изображения для оформления фона блока или маркера списка, но […]
Оформление отзывов, цитат и комментариев в CSS
На большинстве сайтов используются отзывы пользователей. Очень часто их нужно оформлять красиво и броско, чтобы они повышали доверие к сайту/продавцу/компании. Кроме того, на других сайтах […]
CSS-перспектива. 3D-трансформации и анимации
Обычно CSS-трансформации подразумевают двумерное пространство внутри браузера. Т.е. у нас есть оси Х и Y, идущие по горизонтали и вертикали от левого верхнего угла браузера. […]
Селектор :has для выбора родительского и предыдущих элементов
В CSS настроен порядок наследования свойств. То есть свойства шрифта от родительского элемента переходят к вложенному. Плюс мы всегда очень просто можем указать стили для […]
Стилизация и замена полей типа number
Обычно поля типа number, или числовые поля, используют для указания количества товара в любом интернет-магазине или для изменения неких цифровых значений (температуры, веса, количества чего-либо). […]
Атрибут popover в HTML
Popover — это относительно новый HTML-атрибут, позволяющий создавать всплывающие окна на основе простых элементов в вашей HTML-разметке.
Всплывающие (модальные) окна с помощью CSS, JavaScript и jQuery
Всплывающие окна, или pop up window на английском языке — незаменимый атрибут современных сайтов. Второе их название — модальные окна (modal windows). Как правило в […]
Примеры выпадающих меню (dropdown menu)
В web-разработке всегда нужно использовать меню. Они могут быть короткими или длинными, располагаться вверху или сбоку, или в футере, но очень часто они бывают выпадающими. […]
Стилизуем ползунок (input type="range")
Ползунки, которые в HTML-коде представлены тегом <input type=»range»>, обычно довольно скучны. Однако стилизация этих ползунков может быть разнообразной, очень красивой и даже похожей на подарок […]
Создаем слайдер только на CSS
Сегодня слайдеры стали неотъемлемой частью многих сайтов: магазины, курсы, компании таким образом представляют свой товар или услуги. Для слайдеров существует множество реализация на JavaScript/jQuery, например, […]
Приоритет css-селекторов и их вес
Возможно, вы сталкивались с ситуацией, когда вы задаете какое-то свойство для определенного селектора, но после этого … ничего не происходит? В чем дело, не всегда […]
Селекторы CSS. Дочерние, родственные, селекторы атрибутов, псевдоклассы и псевдоэлементы
К простым, или основным в плане их используемости селекторам можно отнести селектор класса и id. То есть ваши элементы браузером легко находятся и легко стилизуются. […]
CSS фильтры
В настоящее время CSS предоставляет нам возможность применять к изображениям цветовые эффекты с помощью свойства filter, такие как насыщенность (saturation), яркость (lightness) и контрастность (contrast), […]
Свойство box-shadow в CSS
Свойство box-shadow уже давно существует в CSS и довольно часто используется для различных блоков, в том числе и при наведении на них. В Figma или […]
Использование свойства clip-path в CSS
Свойство clip-path — это своего рода маска обрезки, знакомая всем дизайнерам из Photoshop, Illustrator или Figma, но средствами кода в CSS. То есть, если вам […]