css - CSS：如何隐藏这样的字段？

Question

我正在尝试设置文本输入字段的样式。到目前为止，我尝试使用边框和图像作为背景，但这不是一个可扩展的解决方案。如何设置如下图所示的输入字段样式？

Answer 1

使用 CSS3box-shadow属性。例子：

input[type=text] {
    box-shadow: inset 2px 2px 2px 2px black;
}

Answer 2

同意@Morpheus。您也可以同时使用 2 个阴影：

input[type=text] {
    box-shadow: inset 0 2px 2px 2px #000, inset 0 -2px 2px 2px #fff;
}