Важнейшая часть создания любого веб-сайта — расположение элементов на странице. Это влияет на то, как пользователи будут воспринимать страницу: куда направлять взгляд, что видеть первым, какие элементы являются главными.
Само по себе позиционирование — управление расположением элемента по осям координат x
, y
, z
, и все инструменты, которые существуют в CSS для позиционирования, предназначены только для этого. Рассматривая каждую тему с этой стороны, становится легче применять знания на практике.
В этом курсе мы рассмотрим базовые возможности позиционирования, известные уже много лет: работа со свойством position
, float
, z-index
. С CSS3 появилось еще несколько фундаментальных правил, позволяющих работать с позиционированием. Такими концепциями стали flex
и grid
, речь о которых пойдет в отдельных курсах, ввиду большого количества материала.
Практика
Многие из уроков в данном курсе будут иметь практики с возможностью перехода в веб-доступ. Старайтесь не просто выполнять задание, а после успешного прохождения также экспериментируйте с кодом и возможностями, которые вы узнали.
В течение курса вы будете встречать самостоятельные задания. При необходимости вы можете попрактиковаться в задачах, представленных в заданиях. Также в них будут примеры кода, в которые можно подглядывать или просто изучать.
CodePen
Другая возможность применить навыки, полученные при работе с курсом — использование сервиса CodePen. Вы можете создать свой pen, внутри которого экспериментировать с позиционированием.
Также в каждом уроке курса будут представлены примеры, которые подгружаются из CodePen. Они доступны для изучения, а также вы имеете возможность в режиме реального времени вносить правки и следить за результатом. Не упускайте такую возможность.
Не забывайте постоянно практиковаться, и тогда ваши навыки позиционирования элементов позволят не задумываясь определять, где и какое позиционирование необходимо использовать в конкретной рабочей ситуации.
Остались вопросы? Задайте их в разделе «Обсуждение»
Вам ответят команда поддержки Хекслета или другие студенты
Для полного доступа к курсу нужен базовый план
Базовый план откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.