CSS盒子模型、圆角边框、盒子阴影
CSS盒子模型、圆角边框和盒子阴影的实现代码示例如下:
/* 设置盒子模型的宽度和高度 */
.box {
width: 200px;
height: 100px;
/* 设置盒子阴影 */
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
}
/* 设置圆角边框 */
.rounded-border {
border: 2px solid #000;
border-radius: 10px; /* 圆角的半径 */
}
HTML部分:
<div class="box rounded-border"></div>
这段代码将创建一个宽度为200px、高度为100px的盒子,并且它有一个10px半径的圆角,边框为2px宽的黑色实线,并且盒子拥有一个阴影效果。
评论已关闭