Layui 实现彩色竖线连接三个居中对齐按钮
.button-container {
display: flex;
justify-content: center;
align-items: center;
height: 100px;
border-left: 4px solid #e6e6e6;
padding-left: 10px;
}
.button-top,
.button-middle,
.button-bottom {
width: 100%;
height: 30px;
line-height: 30px;
text-align: center;
}
.button-top {
background-color: #ffcccc;
}
.button-middle {
background-color: #ffcc99;
}
.button-bottom {
background-color: #ffcc66;
}
通过以上代码,我们可以使用 Layui 的布局组件和 CSS 样式实现用彩色竖线连接三个上下排列的按钮,并且按钮居中对齐的效果。
原文地址: https://www.cveoy.top/t/topic/dfrZ 著作权归作者所有。请勿转载和采集!