如何给一个div添加多个框（）如何给一个div添加多个框？

前端小团队第一题：

文章图片
Paste_Image.png 当看到这个题的时候，需求是写出四个框就行，感觉太简单了，大脑都没过就直接拼了起来，

如果只有一个div 可以border+outline+:before(border)+:after(border)+box-shadow可以添加五个框吧如果想更多就嵌套div 吧

这是我当时回答的原话。
后来另外一个同事的回答，先思考后说话

box-shadow: 0 0 0 10px #ff0000, 0 0 0 20px #000, 0 0 0 30px #ccc

效果图：

文章图片
Paste_Image.png box-shadow每增加一个扩展就增加10px ,(试验一下就知道)
如果用inset content内容区域就会较少扩展的值
【如何给一个div添加多个框（）】知识点参考：http://www.w3cplus.com/content/css3-box-shadow