控制插入边框的两种颜色？

Question

我想知道是否有一种方法可以在CSS中更改嵌入式边框的两个颜色。

正如您所知，嵌入式样式在元素上创建一个边框，从而产生嵌入式边框的错觉。它通过使底部和右侧边框变为您选择的颜色，并将顶部和左侧边框的颜色更改为略微较暗的阴影色来实现这一点。

是否有人知道一种方法，可以控制替代阴影的深度或甚至不同的颜色？

#myElement{
    border: inset 1px white;
}

谢谢。

- Philll_t

---

这个问题很蠢，我刚刚意识到一个修复方法。不过我还是会把这个问题留着，以防别人也在尝试解决这个问题。 - Philll_t

你只需要手动创建边框。border-left: 1px solid #somecolour; 同样适用于右侧、顶部和底部。如果不确定如何复制嵌入效果，请截取一个设置为嵌入的边框的屏幕截图，并使用相同的颜色。然后从那里开始。 - Ariane

是的，你说得对。当我再读一遍我的问题时，我想到了答案。脑子短路了。 - Philll_t

Answer 1

我认为你不能像我提到的那样控制它，但肯定可以控制每个边框的单独颜色：

#myElement{
  border-style: solid;
  border-width: 1px;
  border-top-color: black;
  border-left-color: black;
  border-right-color: white;
  border-bottom-color: white;
}

- Philll_t

---

确实。点个赞，因为我们都会有健忘的时候，而且我们并不总能自己找到显而易见的解决方案。 - Ariane

Answer 2

如果您想在嵌入边框的所有边上使用相同的颜色，请尝试以下方法，我曾使用过并且效果很好。

border-style: solid inset solid solid;

- Ganapati prasad