Сделал для примера три блока. У всех высота 100vh. Не пойму как сделать так, чтобы если мы прокрутили вниз (тоже самое и вверху), второй блок вылетал на всю высоту, то есть на весь экран, и тд, а не смотрелся половина одного, половина другого блока.
<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Блоки</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="block1"></div>
<div class="block2"></div>
<div class="block3"></div>
</body>
</html>
html {
height: 100vh;
}
.block1 {
display: flex;
height: 100vh;
background-color: aqua;
}
.block2 {
display: flex;
height: 100vh;
background-color: chocolate;
}
.block3 {
display: flex;
height: 100vh;
background-color: firebrick;
}