Как перекрыть родительский блок дочерним?

Для перекрытия родительского блока дочерним в CSS существует несколько подходов. Вот некоторые из них:

Использование позиционирования:

Установите для родительского блока position: relative, чтобы создать контекст позиционирования.
Установите для дочернего блока position: absolute и регулируйте его положение с помощью свойств top, right, bottom и left.
При необходимости установите для родительского блока или дочернего блока z-index, чтобы управлять их положением по вертикали.

Например:

   .parent {
     position: relative;
   }
   .child {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     background-color: red;
   }

Использование свойства clip-path:

Установите для дочернего блока свойство clip-path со значением polygon(0 0, 100% 0, 100% 100%, 0 100%) или иное значение, которое определяет область, которую вы хотите показать.
При необходимости установите для родительского блока overflow: hidden, чтобы обрезать части дочернего блока, попадающие за его пределы.

Например:

   .parent {
     overflow: hidden;
   }
   .child {
     clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
     background-color: red;
   }

Использование свойства background-image:

Установите для родительского блока изображение, которое вы хотите использовать в качестве фона.
Установите для дочернего блока свойство background-color с прозрачным значением rgba(0, 0, 0, 0), чтобы сделать его непрозрачным и полностью перекрыть родительский блок.

Например:

   .parent {
     background-image: url('your-image.jpg');
   }
   .child {
     background-color: rgba(0, 0, 0, 0);
   }

Использование свойств box-shadow и outline:

Установите для родительского блока свойство box-shadow со значением 0 0 0 9999px rgba(0, 0, 0, 0.5), чтобы создать непрозрачную тень, которая будет перекрывать дочерний блок.
Установите для дочернего блока свойство outline со значением 9999px solid transparent, чтобы создать видимую границу, которая будет перекрывать родительский блок.

Например:

   .parent {
     box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5);
   }
   .child {
     outline: 9999px solid transparent;
   }

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