How to implement such a frame in CSS?

Question

css

Good evening, how to make such a frame around the block?

Answer 1

And if you need a transparent background in the header, do three border'аand add two dashes at the top with ::beforeand::after

.block {
  position: relative;
  border-right: 2px solid black;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}
.block::before,
.block::after {
  position: absolute;
  content: "";
  width: 30px;
  height: 2px;
  top: 0;
  background: black;
}
.block::after {
  left: 0;
}
.block::before {
  right: 0;
}

Answer 2

codepen.io/r3st1k25/pen/pjPLxV here are the special tags for this.