Как сделать блок на весь экран css

Чтобы сделать блок на весь экран в CSS, необходимо установить высоту и ширину элемента в 100% и сбросить отступы и поля.

Пример:

HTML:

<div class="full-screen">
  <h2>Заголовок</h2>
  <p>Описание блока на весь экран</p>
</div>

CSS:

.full-screen {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

Здесь мы задаем CSS свойства «width: 100%» и «height: 100%» для блока на весь экран. Мы также использовали свойство «margin: 0» и «padding: 0» для сброса полей и отступов по умолчанию. Также мы использовали свойство «box-sizing: border-box» для определения размеров блока включая границы и внутренние заполнения. Если есть рамка, то нужно учитывать ее размер, так как она может уменьшить фактический размер элемента.

Если нужно сделать блок на весь экран с фиксированной высотой, можно использовать свойство «vh» (viewport height):

.full-screen {
  height: 100vh;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

Здесь мы используем свойство «height: 100vh» для задания высоты блока на весь экран равной высоте окна браузера.