- index.html
- style.css
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Позиционирование элементов</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Как выпасть из потока?</h1>
<p>Существует понятие «document flow» или «поток документа». Оно определяет то, как располагаются элементы на HTML-странице.</p>
<p class="p-absolute">Абсолютно позиционированные элементы исключаются из потока.</p>
<p>Другие элементы как бы перестают их замечать и то место, где располагается абсолютно позиционированный элемент, считают
пустым.</p>
</body>
</html>
CSS
.p-absolute {
padding: 20px;
background-color: rgba(0, 255, 0, 0.25);
}
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.
ЗадачиВыполнено
0
Спозиционируйте абсолютно один из абзацев.
- Добавьте в CSS-правило для класса
p-absoluteсвойствоposition: absolute;. - Затем туда же свойство
left: 100px; - и свойство
bottom: 200px;.
Используемые свойства детально разобраны в курсе «Позиционирование».