如何在单词之间放置垂直项目符号?

时间:2016-12-10 01:55:27

标签: css

我怎么会在垂直的单词之间指出要点?所以例如

三月

子弹

1952年卷

子弹

依旧......

感谢您的帮助!

SQL Error: ORA-00904: : invalid identifier
00904. 00000 -  "%s: invalid identifier"

2 个答案:

答案 0 :(得分:4)



ul li:not(:first-child):before {
  content: '•';
  display: block;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css" rel="stylesheet"/>
<ul>
    <li>March</li>
    <li>1952 Volume</li>
    <li>CI Number Three</li>
</ul>
&#13;
&#13;
&#13;

这是你想要的吗?

如果是,你只需要伪元素就可以在元素之前放置子弹点。我提出了一个css条件,这不适用于第一个元素。

答案 1 :(得分:0)

解决方案1:

JSFiddle

<ul class="vertical-bullets">
    <li><span>March</span></li>
    <li><span>1952 Volume</span></li>
    <li><span>CI Number Three</span></li>
</ul>

ul.vertical-bullets > li:before {
   content: "\A";
   white-space: pre;
}

ul.vertical-bullets > li > span {
  margin-left: -15px;
}

(参见:How to insert a line break before an element using CSS

解决方案2:

JSFiddle

<ul class="vertical-bullets">
    <li></li>
    <span>March</span>
    <li></li>
    <span>1952 Volume</span>
    <li></li>
    <span>CI Number Three</span>
</ul>

ul.vertical-bullets > span {
  margin-left: -15px;
}