рамка вокруг внешней стороны страницы, но в верхней части изображения заголовка

Question

Я пытаюсь добавить рамку вокруг моей страницы, но она должна быть поверх изображения заголовка. Я не уверен, как добиться чего-то подобного.

Я думал может быть что-то вроде

body {

    border:solid 1px brown
    padding: 5px;

}

Но что-то вроде этого, очевидно, толкает все во внутрь ... Это вообще возможно сделать?

Вот что я пытаюсь сделать: https://imgur.com/a/gZAJ5Gy Коричневая рамка просто продолжается вокруг всей страницы.

Answer 1

Этого можно достичь, используя псевдоэлемент исключительно для стилистических целей c.

Вот некоторые CSS, которые вы можете попробовать:

body {
    position: relative;
}

body::after {
    border: solid 1px brown;
    padding: 5px;
    content: '';
    height: 100%;
    width: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
}

По умолчанию это должно быть превышение вашего тела как "после", вы можете поиграться с z-index для достижения желаемого эффекта, если нет. Надеюсь, это поможет!