21Для того, чтобы перенести блок CSS на странице сайта, можно использовать свойства CSS, отвечающие за позиционирование элементов.
Основные свойства, используемые для позиционирования элементов, это «position», «top», «bottom», «left» и «right». Рассмотрим их подробнее:
- «position» — указывает тип позиционирования элемента. Этот параметр может принимать следующие значения:
- static — элемент располагается в соответствии с обычным потоком документа. Это значение по умолчанию.
- relative — элемент позиционируется относительно своего обычного расположения.
- absolute — элемент позиционируется относительно ближайшего родительского элемента, который имеет позиционирование, отличное от «static».
- fixed — элемент позиционируется относительно окна браузера и остается на месте при прокрутке страницы.
- «top», «bottom», «left» и «right» — указывают расстояние между элементом и соответствующей границей родительского элемента. Эти параметры могут принимать значения в пикселях, процентах и других единицах измерения.
Например, чтобы перенести блок на 10 пикселей вниз от его обычного расположения, можно использовать следующие CSS-правила:
.my-element {
position: relative;
top: 10px;
}Эти правила указывают, что блок должен быть позиционирован относительно своего обычного положения и смещен на 10 пикселей вниз от него.
Аналогично можно изменять и другие параметры позиционирования, чтобы перенести блок в нужное место на странице.
