空心矩形样式

UI设计了一个空心矩形样式，所以这边找了段CSS代码来实现：

div {
  width: 80px;
  height: 80px;
  background-color: red;
  background-clip: content-box;
  border: 40px solid orange;
}

参数说明：

• background-color—控制圆心颜色.
• background-clip—规定背景的绘制区域.
• border— 控制外环大小和颜色.

  注：如果不设置background-clip，在border有透明度的时候，会透到下方的background，这也证明background默认是包括了border的。

实现效果如下：