css - 有没有办法在 html 中为所有屏幕尺寸和分辨率固定圆环内径尺寸

Question

我制作了一个内径为 13 毫米、屏幕分辨率为 1280X800 的戒指，不幸的是，当屏幕分辨率改变时，戒指的内径也在改变。有没有办法为所有屏幕尺寸和分辨率固定圆环内径尺寸。

.ring {
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  text-align: center;
  line-height: 100px;
}

.black_circle {
  border: 5px solid;
  width: 50px;
  height: 50px;
  border-radius: 100%;
}

<div class="ring">
  <div class="black_circle"></div>
</div>

Answer 1

为什么不直接使用 13mm 而不是 50px。这是允许的。

Pixels (px) are referred to as absolute units because they will always be the same size regardless of any other related settings. Other absolute units are as follows:

• q, mm, cm, in: Quarter millimeters, millimeters, centimeters, or inches

• pt, pc: Points (1/72 of an inch) or picas (12 points)

You probably won't use any of these very often except pixels.

MDN