Question

我可以按照我想要的方式混合div吗？我明白我可以用

body {
    box-shadow: 10px 10px 10px 10px white;
}

要靠近，但我想要做的是平等地混合所有边缘（顶部，底部，左侧，右侧）。盒子阴影似乎真的只混合了3个边，给出了3D效果。我对3D并不感兴趣，只是希望我的所有边缘都融入到背景照片中。

帮助，朋友们！

Answer 1

请阅读您将“10px 10px 10px 10px”应用到..

http://css-tricks.com/snippets/css/css-box-shadow/

你给予HORIZONTAL和VERTICAL偏移10px和10px，这就是你得到3d效果的原因。

删除它们：

box-shadow: 0 0 10px 10px white;

http://jsfiddle.net/wAcC6/

离。

Answer 2

请参阅http://css3gen.com/box-shadow/和http://css-tricks.com/snippets/css/css-box-shadow/ 您已删除垂直和水平偏移

http://jsfiddle.net/d552b/

-webkit-box-shadow: 0 0 20px 0 rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0 0 20px 0 rgba(50, 50, 50, 0.75);
box-shadow:         0 0 20px 0 rgba(50, 50, 50, 0.75);

box-shadow

的组件说明

阴影的水平偏移，正值表示阴影在框的右侧，负偏移将阴影打开盒子的左边。
阴影的垂直偏移，为负数一个意味着盒子阴影将在盒子上方，一个阳性意味着阴影将在框下方。
模糊半径（可选），如果已设置到0时阴影会变得尖锐，数字越高越多模糊不清。
展开半径（可选），正值增加阴影的大小，负值减小大小。默认值为0（阴影与模糊大小相同）。
<强>颜色

CSS混合<div> </div>的所有边缘

2 个答案: