CSS@绘制对角线，控制倾斜角度和线的长度固定

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

.element::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: black;
  transform-origin: top left;
  transform: rotate(45deg);
}

.element {
  width: 200px;
  height: 200px;
  background-image: linear-gradient(45deg, black 50%, transparent 50%);
  background-size: 100% 2px;
  background-position: top left;
}

<svg width="200" height="200">
  <line x1="0" y1="0" x2="200" y2="200" stroke="black" stroke-width="2" />
</svg>