css - 内边框 CSS - 可能

Question

我想知道是否有为元素设置外边框和内边框的属性，例如我想将深灰色边框作为外边框，将白色边框作为内边框。我附上了一张图片来阐明我的观点，我可以用 2 层来做到这一点，一个作为具有深灰色边框的父层，另一个作为具有白色边框的子层，但是必须有更好和有效的方法。如果您有实现此目标的正确概念，请指导。感谢您的宝贵时间。干杯

Answer 1

您可以使用内嵌框阴影。 <强> DEMO

button {
    border: solid 1px #aaa;

    // Adds the inner "border"
    box-shadow: 0 0 1px #fff inset;

    background-image: linear-gradient(to bottom, #cfcfcf 0%, #c0c0c0 100%);
    padding: 20px;
    border-radius: 10px;
}

如果你想设置边框的“宽度”，你可以使用第四个值。带有 3px 宽插图框阴影的示例:

box-shadow: 0 0 0 3px #fff inset;

有关框阴影的更多信息，MDN