如何在超厚和多色边框周围创建超薄边框（黑色）

Question

我想添加超薄黑色边框
在这个戒指的边界上方和下方。

http://jsfiddle.net/PUBqA/5/

目标是让这个戒指容易看到 在白色背景上。

这样做的唯一方法就是添加一些薄的 戒指外和戒指内的黑色边框。

这是我到目前为止的代码：

的CSS：

#ring{
    width:250px;
    height:250px;
    border:100px solid black;
    border-color: red blue green yellow;
    border-radius: 50%;
}

HTML：

<div id="ring"></div>

Answer 1

尝试在代码中添加如下内容：

<强> DEMO

#ring{
   box-shadow:0 0 0 10px #000, 0 0 0 10px #000 inset;
  -khtml-box-shadow: 0 0 0 10px #000, 0 0 0 10px #000 inset;
  -moz-box-shadow: 0 0 0 10px #000, 0 0 0 10px #000 inset;
  -webkit-box-shadow: 0 0 0 10px #000, 0 0 0 10px #000 inset;
}