Css 同一div上的框内和框外阴影

我不能在同一个div上同时使用内盒阴影和外盒阴影吗？ 我试过了，但没用

---

您需要使用逗号分隔两个阴影： 您还需要添加特定于浏览器的前缀，以便在支持它的任何地方都能使用：

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

---

您还必须为阴影指定颜色，以使其可见。

使用CSS3，您可以通过逗号分隔多框阴影，例如：

box-shadow: 10px 10px 10px, 0 0 10px inset;

---

您可以想要多少就有多少。

添加了一个可运行的代码段：

div{
顶部：100px；
位置：绝对位置；
左：100px；
高度：100px；
宽度：100px；
盒子阴影：10px 10px 10px rgba（0,0,0,5），
0 10px rgba（255,0,0,5）插入；
边界半径：5px；
背景：白色；
}
身体{
背景：#fff
}