[分享]css两个边框阴影

CSS是网页设计中不可或缺的一部分，其中之一就是边框样式的设置。我们可以通过CSS很容易地设置元素的边框，同时也可以设置其阴影效果。/ 设置元素的边框样式 / border: 2px solid 00...

CSS是网页设计中不可或缺的一部分，其中之一就是边框样式的设置。我们可以通过CSS很容易地设置元素的边框，同时也可以设置其阴影效果。

/* 设置元素的边框样式 */
border: 2px solid #000;

/* 设置元素的内边距 */
padding: 10px;

/* 设置元素的外边距 */
margin: 10px;

/* 设置元素的阴影 */
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5), -2px -2px 5px rgba(0, 0, 0, 0.5);

上述代码中，我们使用了border属性来设置元素的边框样式，其中2px表示边框的宽度、solid表示边框的样式、#000表示边框的颜色。

接下来，我们使用padding属性设置元素的内边距，即元素内容与边框之间的距离。同时，我们也使用margin属性设置元素的外边距，即元素与其他元素之间的距离。

最后，我们使用box-shadow属性设置元素的阴影效果。其中2px 2px 5px表示阴影的偏移值、模糊半径和扩散半径，rgba(0, 0, 0, 0.5)表示阴影的颜色和透明度。此外，我们还可以使用inset关键字来设置内阴影效果。

通过以上代码，我们可以轻松地为网页元素设置边框和阴影效果，使其更加美观和立体。