在正方形的中心放置一个十字架，该十字架可缩放到容器大小。

<div class="container">
  <div class="cross"></div>
</div>

.container {
  width: 200px;
  height: 200px;
  position: relative;
}

.cross {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  border: 2px solid black;
}

.cross::before,
.cross::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  background-color: black;
}

.cross::before {
  transform: translateX(-50%);
}

.cross::after {
  transform: translateX(-50%) rotate(90deg);
}

const container = document.querySelector('.container');
const cross = document.querySelector('.cross');

function resizeCross() {
  const containerSize = Math.min(container.offsetWidth, container.offsetHeight);
  cross.style.width = containerSize + 'px';
  cross.style.height = containerSize + 'px';
}

window.addEventListener('resize', resizeCross);