Материалы с тегом: CSS
- Родительский селектор в CSS: :has() наконец работает
Лет десять назад фраза «в CSS нельзя выбрать родителя по его потомку» считалась аксиомой, и любой вёрстальщик знал её наизусть. Нужно подсветить карточку, в которой есть картинка? Добавляй класс на сервере или через Java…
- CSS-переменные: переключаем тему сайта без препроцессоров
Тёмная тема на сайте у меня ассоциировалась исключительно с Sass или Less — заводишь переменные, компилируешь два набора стилей, подключаешь нужный файл через класс на body. Работало, но каждое изменение цветовой палитры…
- CSS в 2026: тихая революция, которую многие ещё не заметили
Долгие годы CSS воспринимался как язык вспомогательный — им красили заголовки, расставляли отступы, а всё сколько-нибудь сложное неизбежно передавалось JavaScript. Сетки нужно было выравнивать через флексбоксы с костылям…
- Шикарный аудиоплеер на Joomla без плагинов
На сайте Зелёная Ива произошло тихое, но важное событие: теперь здесь можно не только читать и смотреть, но и слушать. Мы добавили собственный аудиоплеер, который позволяет проигрывать наши MP3-файлы прямо в браузере без…
- Управление состояниями и плавность без скриптов
Если первые две части нашего разговора были посвящены структуре и контексту (контейнерные запросы, @layer, @scope), то теперь пришло время поговорить о поведении. Современный CSS позволяет описывать не только то, как выг…
- Современный CSS: От деклараций к динамике, продолжение
CSS больше не ограничивается описанием внешнего вида отдельных элементов. Если раньше мы работали с изолированными декларациями вроде margin: 10px;, то сегодня язык позволяет выстраивать полноценную систему отображения и…
- SVG Урок для новичков: рисуем иконку дома
Часто, когда говорят о SVG, его представляют как идеальный, «чистый» векторный мир — мир математических линий, кривых и форм, которые можно бесконечно масштабировать без потери качества. И это правда. Но есть и другая, н…
- Современный CSS: От деклараций к динамике
CSS давно перестал быть просто инструментом для задания цвета или отступа. Если раньше мы думали в терминах статических правил (color: red;), то сегодня CSS — это полноценный язык для создания динамических, адаптивных и …
- Фильтры в SVG
Часто, когда говорят о SVG, его представляют как идеальный, «чистый» векторный мир — мир математических линий, кривых и форм, которые можно бесконечно масштабировать без потери качества. И это правда. Но есть и другая, н…
- Технические методы (способы) вставки SVG-графики на веб-страницу
Как человек, работавший в своё время с такой замечательной программой как Adobe Flash (а до этого Macromedia Flash) я просто не могу себе позволить нелестно отзываться о векторной графике в целом и, как мне кажется, об о…
- CSS: Новинки и Тренды, Облегчающие Жизнь Веб-Разработчика
CSS (Cascading Style Sheets) – это язык, который постоянно развивается, предлагая новые возможности и улучшая существующие, чтобы сделать процесс стилизации веб-сайтов более гибким, эффективным и приятным. В этой статье …
- Единицы измерения экрана (px, rems, em и другие)
Говоря о единицах измерения экрана, базовой величиной будет пиксель (px), однако на пикселе единицы измерения не заканчиваются. И тем не менее нужно понимать, что любое значение других единиц измерения будет в итоге брау…
- Мобильная версия сайта, тег для Android
Не останавливающийся прогресс, конечно же, стремится сделать человеческую жизнь лучше. Та же история с «сайтостроением», новые механизмы придумывают специально, чтобы «облегчить жизнь». Однако меня всё чаще удивляет тако…
- Приоритеты селекторов CSS
Селектор CSS — как «регулировщик», указывающий браузерам каким элементам веб-страницы применять тот или иной стиль. Селекторы делятся на базовые, комбинированные и «псевдо-селекторы» (это те, которые работают с элементам…
- Сделать круглую рамку для картинки в CSS
Когда-то давно, один из моих «учителей жизни» сказал одну фразу, про программирование, которая оказалась актуальной не только для программирования, но и, например, для стилизации объекта. Звучала она так: «Тебе не надо з…
- CSS: Подсказки (Tooltip)
В последнее время стало популярным, добавлять на сайт «подсказки», сам я не особо понимаю для чего они нужны, объясняя свою точку зрения следующим фактом: всё больше и больше пользователей переходят на смартфоны и планше…
- CSS – делаем элемент меню
Когда только только «зарождалось» сайтостроение, и стилями в Интернете (в Рунете по крайней мере точно) почти не пользовались, большинство вопросов решалось путём «вставки» изображений. Сегодняшним днём многие дизайны им…
- CSS : Visible и Hidden
В вопросах сайтостроительства и в большинстве своём – вёрстки сайтов, всё чаще и чаще камнем преткновения у меня оказывается вопрос так или иначе связанный с мобильной версией сайта. Причина банальна – сегодняшним днём р…
- CSS : Анимация подчёркивания
Работая над очередным вопросом дизайна сайта, наткнулся на один интересный эффект, и хоть это было совсем не то, что я искал, но мне показалось правильным «сохранить про запас» данный трюк, ибо мало ли где он мне ещё в б…
- CSS : изменить размер капчи Google
Предыстория у вопроса такова, что мне подкинули работу – заменить форму обратной связи на одном сайте, сделанном на CMS Bitrix. Вся проблема заключалась в том, что разработчики Bitrix посчитали себя супергероями, положив…
