缩放CSS border-radius

Question

说我有以下CSS圈但想要改变宽度＆amp;每个高度为320px。如何正确扩展.max()，-moz-border-radius，-webkit-border-radius？

似乎如果我只是使所有的边界半径320px保持圆形状，但不确定这是否是正确的方法。

border-radius

Answer 1

如果你有任何宽度/高度的正方形，只需设置border-radius: 50%;无论元素如何缩放，都应该给出一个圆圈。

#circle1 {
  border-radius: 50%;
  width: 100px;
  height: 100px;
  background-color: #E74C3C;
}

#circle2 {
  border-radius: 50%;
  width: 200px;
  height: 200px;
  background-color: #F1C40F;
  position: absolute;
  left: 125px;
}

#circle3 {
  border-radius: 50%;
  width: 300px;
  height: 300px;
  background-color: #2ECC71;
  position: absolute;
  left: 225px;
}

<div id="circle1" />
<div id="circle2" />
<div id="circle3" />