От автора: на днях я столкнулся с необходимостью установить границы элемента CSS с трех сторон и подумал, что было бы интересно рассмотреть всевозможные способы сделать это. Ни один из них не является особенно сложным, но, возможно, вы считаете один из них наилучшим из-за четкости синтаксиса, эффективности или чего-то другого.
Всплывающие метки на чистом CSS с помощью псевдо-класса ::placeholder-shown
От автора: в этом руководстве мы создадим решение, как можно создать на чистом CSS метки, используя псевдо-класс ::placeholder-shown.
От автора: вы можете легко применить в CSS фильтры изображений и других элементов с помощью свойства filter. Но что, если вы хотите применить фильтр только к фону элемента? Это довольно сложно.
От автора: дизайнер, с которым я работаю, представил на недавнем собрании команды свой проект. Она проделала замечательную работу, объединив концепцию системы дизайна, компоненты, шаблонов и все, что между ними, и это сделало бы любого стороннего разработчика счастливым.
CSS position: sticky — создание эффектов пролистывания с использованием липкого позиционирования
От автора: липкие элементы преимущественно используются для удерживания чего-либо, отображаемого на экране во время прокрутки. Как же здорово, что мы можем и скрыть элементы так же!
От автора: с помощью HTML-документов мы можем отображать, скрывать или реорганизовать части страницы в зависимости от условий окна просмотра. Если, например, окно браузера имеет ширину 480 пикселей, мы можем изменить панель навигации с горизонтальной на вертикальную. Мы можем сделать что-то подобное, используя медиа запросы CSS и документы SVG. Рассмотрим, например, логотип вымышленной компании Hexagon Web Design & Development ниже.
Сверхмощные компоненты сетки с помощью пользовательских свойств CSS
От автора: некоторое время назад я написала хорошо принятую статью об объединении переменных CSS с CSS-сеткой, чтобы создавать более удобные макеты. Но CSS сетка предназначена не только для страниц! Это распространенный миф. Хотя это, безусловно, очень полезно для макетов страницы, я столь же часто вижу, что сетки можно использовать, когда речь идет о компонентах. В этой статье я рассмотрю использование сетки CSS на уровне компонентов.
Продвинутая CSS-темизация: динамические темы с помощью переменных и JavaScript
От автора: в этом руководстве по тому, как создаются в CSS темы, мы будем использовать пользовательские свойства (также известные как переменные CSS) для реализации динамических тем простой HTML-страницы. Мы создадим темные и светлые варианты тем, затем напишем JavaScript, чтобы переключаться между ними, когда пользователь нажимает кнопку.
От автора: как можно улучшить с помощью CSS формы? Недавно нам в SiloCreativo посчастливилось прочитать замечательную статью Феликса Ортеги о UX под названием «Прогрессивное раскрытие: Поиск простого в сложном» с отличными реальными примерами, позволяющими лучше понять эту технику прогрессивного раскрытия и как применить ее в нашей работе.
От автора: если изображение стоит тысячи слов, то наложение фонов CSS друг на друга должно стоить еще больше. Аналогично, возможности дизайна, которые открываются с помощью режимов смешивания в CSS, скорее всего, больше, чем вы можете себе представить.
Все права защищены © 2026
Бернацкий Андрей Васильевич
Служба поддержки
Материалы сайта (статьи, уроки, видео уроки, курсы и прочее) предназначены исключительно для самостоятельного изучения
2018-10-18