От автора: под «изображениями CSS» я имею в виду изображения, созданные с использованием только HTML-элементов и CSS. Они выглядят так, как если бы они были SVG, нарисованные в Adobe Illustrator, но они были сделаны прямо в браузере. Некоторые из тех методов, которые я видел, используются возиться с пограничными радиусами, тенями блоков, а иногда и с clip-path. Вы можете найти множество замечательных примеров, если вы будете искать ежедневные изображения css на CodePen.
От автора: дни таблиц, маркерные хаки, магия позиционирования и неортодоксальные способы обтекания использовались для достижения желаний макета, и они, наконец, позади. Теперь у нас есть выбор, чтобы использовать самый мощный метод макета, который когда-либо приходил в CSS на сегодняшний день; Grid.
От автора: в этом вводном уроке я расскажу вам об этой относительно новой функции CSS, расскажу о текущей поддержке в браузерах и покажу вам несколько примеров того, как работает CSS Grid Layout Module.
От автора: если вы работаете в веб-индустрии уже пару лет, у вас могло возникнуть ощущение, что вы всегда программируете или проектируете один и тот же макет сайта. Несмотря на то, что тенденции приходят и уходят, большинство сайтов по-прежнему выглядят одинаково: почти каждый из них использует сетку с 12 колонками, два и три столбца, блоковые макеты и аналогичные формы. На это становится довольно скучно смотреть, и UX тоже так себе.
От автора: веб-сообщество, по большей части, было впечатляюще открытым местом. Таким образом, многие лучшие методы развития происходят прямо в открытом доступе, в блогах и на форумах, развиваясь по мере их обновления и улучшения. Я думал, что это может быть забавно (и увлекательно) на самом деле следовать этому творческому обмену. Взглянуть на популярный трюк Clearfix CSS и узнать, как именно выглядит технология веб-дизайна.
От автора: поле поиска — крайне утилитарная часть среднестатистического сайта. Но это не значит, что его следует игнорировать. Наоборот. Поиск предоставляет пользователям простой способ найти то, что они ищут, и может быть бесценным на контент-сайтах. Поэтому стоит потратить некоторое время, чтобы ваша область поиска была привлекательной, заметной и простой в использовании.
Анимация элементов при прокрутке страницы с помощью CSS библиотеки
От автора: в данном уроке мы с вами рассмотрим, как сделать анимацию для появляющихся при скролле страницы блоков. Подобные эффекты чаще всего встречаются на лендингах, когда при прокрутке страницы, блоки плавно появляются, или плавно выезжаю сбоку и так далее.
От автора: есть несколько способов того, как осуществляется подгонка текста, чтобы он заполнял контейнер. Существуют различные технологии, которые мы можем применить, и разные соображения, которые нужно принять во внимание при использовании этих технологий. Давайте перечислим их.
Быстрое создание прототипа приложения с помощью CSS Grid и переменных CSS
От автора: CSS Grid и Переменные CSS предоставляют front-end разработчикам огромные возможности. Первая упрощает создание макетов веб-сайта, в то время как вторые привносят силу переменных в таблицы стилей. В этом руководстве я покажу вам, как использовать их вместе, чтобы получить быстрое создание прототипа приложения.
От автора: я продолжаю наблюдать ситуацию, когда авторы и докладчики описывают единицу ch CSS как значение «ширины символа». Это приводит к утверждениям, что вы можете «сделать столбец контента шириной в 60 символов для максимальной читаемости» или «указать размеры изображения в определенном количестве символов!».
Все права защищены © 2026
Бернацкий Андрей Васильевич
Служба поддержки
Материалы сайта (статьи, уроки, видео уроки, курсы и прочее) предназначены исключительно для самостоятельного изучения
2018-08-09