Html 有没有办法在div中制作双面内部阴影？

是否有任何可能的方法在css中创建一个双面的内部阴影框，如下图所示

---

您可以使用背景图像填充div：

#自定义{
最小宽度：200px；
最小高度：200px；
宽度：100%；
背景图像：url（“http://i.stack.imgur.com/y6HMs.png");
背景重复：无重复；
背景尺寸：包含；
}

---

您可以为两个阴影使用伪元素：

div{
长方体阴影：嵌入0.2em-.5em灰色；
线高：3em；
文本对齐：居中；
位置：相对位置；
溢出：隐藏；
}
部门：之前，
部门：之后{
内容：''；
显示：内联块；
宽度：40%；
身高：100%；
位置：绝对位置；
左：5%；
前-100%；
边界半径：50%；
箱形阴影：0.02米#aaa；
}
部门：之后{
左：自动；
右：5%；
}
div[内容可编辑]{
边缘顶端：3em；
显示：内联块；
大纲：无；
}

你好，世界
在此处键入…并观察阴影

您可以使用图像div的宽度为100%。所以，最好不要使用图像。-谢谢。如何集中背景图像？@user2326844我编辑代码使用

background size:contain，使其适合于内容。为什么要发出额外的http请求来做一些可以单独使用CSS完成的事情？@JoseRuiSantos，因为伪元素在FF和IE浏览器中没有完全支持。@chsdk这不是真的，正如您所见