Bootstrap:使用子弹列表内联？

Question

谁知道,如何在Bootstrap 3的水平列表中的元素之间添加项目符号/分隔符？

<ul class="list-inline">
   <li>Author: Michal</li>
   <li>Modified: 17.08.2014</li>
   <li>Comments: 5</li>
</ul>

Answer 1

你的CSS:

.list-inline{display:block;}
.list-inline li{display:inline-block;}
.list-inline li:after{content:'|'; margin:0 10px;}

不用说你可以使用你想要的任何东西而不是管道分隔符,这只是一个例子

.list-inline li:last-child:在{content:'';}之后 (6认同)
或者你可以这样做： .list-inline li:not(:last-child):after{content:'\2022'; 边距:0 10px;} (3认同)

Answer 2

你可以用 •

<ul class="list-inline">
   <li>&bull; Author: Michal</li>
   <li>&bull; Modified: 17.08.2014</li>
   <li>&bull; Comments: 5</li>
</ul>

或者你可以使用Font Awesome这样的图标,一个子弹图标就可以了<i class="fa fa-circle"></i>