我正在使用Avada Wordpress主题。
我想创建一个显示那种结果的检查列表
它之间有一条文字线(我知道如何让它出现)。
您是否知道如何自定义检查列表模块或其他模块或使用自定义CSS来获得此“line-bullet-point”?
由于
答案 0 :(得分:2)
HTML
<ul>
<li>
<span class='line'></span>
<span class='circle'></span>
</li>
<li>
<span class='circle'></span>
</li>
</ul>
CSS
ul {
list-style : none;
}
li{
display : flex;
flex-flow: row;
min-height : 100px;
position : relative;
}
span.circle {
margin-right : 100px;
text-align: center;
width : 1em;
height : 1em;
border:1px solid red;
background-color:#f3f5f6;
border-radius : 50%;
z-index : 100;
}
span.line {
position : absolute;
height : 100%;
border : solid red 0.1em;
top : 1em;
left : 0.5em;
}
li:last-child span.line{
display : none;
}
JSfiddle:http://jsfiddle.net/1yqw1y87/1/