css - 如何获得框阴影的预期颜色？

Question

我有一个网站的 psd 图像，我想在框阴影上获得与图像中显示的颜色代码相同的颜色代码。

例如:背景颜色为:#e6e6e6而且里面的内容是白色的。

我想要得到 2px 宽的 insite 框阴影。从右数第一个像素的颜色代码:#e3e3e3

第二个像素的颜色代码:#f1f1f1

试验不透明度和其他设置需要时间，那么有什么方法可以输入这些颜色以获得预期的结果/颜色吗？

Answer 1

如果我理解得很好的话，你可以画出 2 个没有模糊的阴影:2 种颜色的 2 px 阴影。

div,
p {
  box-shadow: 0 0 0 1px #e3e3e3, 0 0 0 2px #f1f1f1;
  Background: #e6e6e6;
  color: white;
  padding: 1em;
  margin: 1em;
  text-shadow: 0 0 1px gray
}
p {
  box-shadow: 1px 1px #e3e3e3, 2px 2px #f1f1f1;
}
/*awfull  body bg for demo*/

body {
  background: linear-gradient(45deg, purple, turquoise, tomato);

<div>
  box
</div>
<p>
  or did you mean this ?
</p>