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

Question

[webrapist]

Как сделать подобный эффект? Я сначала думал, просто линии как фон вставить. А что, если надо будет сделать эту рамку резиновой?
Не нужен код, просто на словах объясните, пожалуйста, как это можно осуществить.

Answer 1

[Ivan Bogachev]

Можно или нижний border делать с помощью псевдоэлемента с z-index больше, чем у мужика (если использовать :after - оно так и получится) или верхний border делать псевдоэлементом с z-index меньше, чем у мужика

Answer 2

[Danila]

мужика вырезать пнгшкой с прозрачным фоном
все линии кроме верхней бордером
верхнюю псевдоэлементом с z-index меньше чем мужик

Comments

[webrapist]

Верхняя линия - фоновое изображение?

[Danila]

webrapist: я имею ввиду ваш квадрат из белых линий
верхняя линяя - псевдоэлемент

[Danila]

webrapist: не мастер я объяснять, лучше вот, смотрите
codepen.io/DNLHC/pen/zqXRBq

Answer 3

[Serj-One]

Уже раза 3 писал ответ по поводу этой рамки в этом макете)
codepen.io/Serj-One/pen/NNxPrN

Comments

[webrapist]

Совпадение.