css - 设置非数字列表值

Question

我有一个列表，我正在通过标签内的代码设置自定义数值<ol>：

<li value="123">Text Here</li>

但是有时该值是空的，我需要它显示为或者NNO根本不显示（空值）；然而事实证明这很难做到。

如果我把它留空，它通常会为列表编号，如果我把NNO它作为值，它会做同样的事情。

有没有办法在这里做我想做的事？如果重要的话，我doctype的就是。html5

编辑：为了清除它，虽然数值有时可能为空，但li标签之间的文本输出将始终存在；所以我正在寻找的输出将是这样的..

123. Text Here
NNO. Text Here
128. Text Here

Answer 1

Just set the list style on those elements with non numerical values to list-style:none to show no value.

see this jsfiddle

http://jsfiddle.net/bpFgS/

Answer 2

Actually li elements only accepts integers in their value attribute, so it's not possible solely through li's.

Depending on your layout you could simply remove the list-style and prepend your own 'value' in a span before the rest of your content.

Answer 3

Try wrapping the data inside the list entries in <span>s and hide them when the value is blank.

li[value=""] span
{
    visibility: hidden;
}

http://jsfiddle.net/26z4W/2/

...Though that works to hide the text instead of the list bullets or numbers, which I just realized is what you wanted. Rooster's answer works for that.

---

Here's one way to do it, based on Rooster's answer but with support for using "NNO. " (using li[value=""]:before {content: "NNO. "}) instead of having it blank.

http://jsfiddle.net/26z4W/

Uunfortunately, it seems no browser implements ::marker yet, but if they do eventually that would make things like this much easier.