css - 使用 css 和外部文本每行显示一个元素

Question

我有以下 html 片段:

<div>
    <a class="item" href="http://google.com">Google</a>,
    <a class="item" href="http://yahoo.com">Yahoo</a>,
    <a class="item" href="http://yandex.com">Yandex</a>
</div>

现在是这样显示的:

Google, Yahoo, Yandex

我需要它像这样显示:

Google,
Yahoo,
Yandex

是否可以仅通过修改 .item 类的 CSS 属性来完成？ (不插入新标签(例如 BR)并且不触及逗号)？

我试过

.item {
    clear: both;
    float: left;    
}

但是所有逗号都留在第一行。

Answer 1

也许这可行，

添加一个空字符串，而不是在 css 中添加一个新的逗号并删除或更改旧逗号的颜色

a:before {
    content:'';
    display: block; 
}

jsFiddle DEMO