css实例 素材 |css 表格td间距

/* CSS3矩形阴影 */
.box{
box-shadow: 10px 10px 20px #888;
}
/* CSS3边框半透明 */
.box{
border: 2px solid rgba(255, 255, 255, 0.5);
}
/* 纯CSS模拟手风琴效果 */
.accordion li{
width: 100px;
height: 100px;
transition: width 0.5s;
}
.accordion li:hover{
width: 200px;
}
/* CSS3水平垂直居中 */
.box{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* 纯CSS悬浮效果 */
.box{
position: relative;
}
.box:hover:after{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}

以上是几个常见的CSS实例素材，它们只是CSS中的冰山一角，还有很多其他的实例素材等待大家去探索，相信在实践中不断探索和学习，大家可以变得更加熟练和自信。