Приветствую вас в курсе «CSS. Основы позиционирования элементов на веб-странице». Это вводное видео, в котором я хотел бы рассказать, о чем этот курс и зачем он вам может быть нужен.

Элементы на веб-странице идут, как правило, по умолчанию, в нормальном потоке. Что это значит? Блочные элементы (например, div) располагаются друг под другом, а строчные – такие, как span, и им подобные – один за другим в пределах одной строки, пока хватает места.

Все было бы хорошо, но как только мы приступаем  к верстке какого-то макета сайта, нам приходится сталкиваться с тем, что элементы нужно расположить определенным образом – не так, как они располагаются по умолчанию.

Основная задача – вывести эти элементы из нормального потока и расположить в такой позиции, в какой Вам бы хотелось. Без знания основ позиционирования элементов добиться какого-либо эффекта позиционирования на веб-странице будет очень трудно.

Этот курс о двух CSS-свойствах.  Первое – это свойство position. И второе свойство – это float.  Свойство position отвечает за позиционирование элементов на веб-странице, а свойство float – за обтекание элементов.

Это два базовых свойства, с помощью них Вы можете изменить нормальный поток элементов на веб-странице, расположить их в том порядке, который Вам необходим. Мы разберем то, как эти два свойства будут влиять на свойства тех элементов, к которым они будут применяться, и рассмотрим основные техники позиционирования, узнаем, какие есть  трюки, чтобы делать все проще и эффективнее.

Знание основ позиционирования элементов – это та база, которая обязательно нужна любому человеку, который собирается работать с технологией CSS, верстать веб-страницы, располагать элементы нужным образом. Эту базу нужно пройти на практике и буквально прочувствовать на себе.

Надеюсь, данный курс поможет Вам пройти этот путь как можно быстрее и эффективнее. Буду очень рад видеть Вас среди участников этого курса.

Напишите в комментариях:

1) Был ли опыт работы с позиционированием элементов на веб-страницах до этого? В чем были трудности?

2) Может вы знаете еще другие свойства CSS, которые отвечают за позиционирование элементов на веб-страницах, кроме float и position?

3) Подготовьте HTML и CSS документ, в котором будете работать и свой блокнот или другую систему, где вы будете фиксировать полученные знания.

Как это организую я, можно посмотреть здесь

Если не секрет, поделитесь, где и как Вы храните справочные данные по веб-разработке. Это обычный блокнот или другое решение?