1

嗨,我喜欢使用这样的有序列表。

      (a) You must give any other recipients of the Work or
          Derivative Works a copy of this License; and

      (b) You must cause any modified files to carry prominent notices
          stating that You changed the files; and

      (c) You must retain, in the Source form of any Derivative Works
          that You distribute, all copyright, patent, trademark, and
          attribution notices from the Source form of the Work,
          excluding those notices that do not pertain to any part of
          the Derivative Works; and

      (d) If the Work includes a "NOTICE" text file as part of its
          distribution, then any Derivative Works that You distribute must

我试过了,但它显示了数字。

/* Wrap alphabet. */
ol.wrapAlphabet {
    list-style-type: lower-alpha;
    counter-reset: item;
    margin-left: 0;
    padding-left: 0;
    margin-top: 5px;
}

ol.wrapAlphabet li {
    display: block;
    margin-left: 2em;
}

ol.wrapAlphabet li:before {
    display: inline-block;
    content: "(" counter(item) ") ";
    counter-increment: item;
    width: 2em;
    margin-left: -2em;
}​

html

<ol class="wrapAlphabet">
<li>
      You must give any other recipients of the Work or
          Derivative Works a copy of this License; and
</li>

<li>
      You must cause any modified files to carry prominent notices
          stating that You changed the files; and
</li>

<li>
      You must retain, in the Source form of any Derivative Works
          that You distribute, all copyright, patent, trademark, and
          attribution notices from the Source form of the Work,
          excluding those notices that do not pertain to any part of
          the Derivative Works; and
</li>
4

3 回答 3

2

使用content: "("counter(item, lower-alpha)")";而不是content: "(" counter(item) ") ";应该工作

演示:http: //jsfiddle.net/J5NmV/1/

于 2012-11-19T04:52:10.170 回答
1

counter(item)只给你整数而不是数字。因此,您需要使用 JavaScript 或 jQuery 循环并设置属性,例如data-count设置字母。

然后您需要替换counter(item)toattr(data-count)以便它显示字母。

于 2012-11-19T04:45:07.037 回答
1

使用这个 CSS:

/* Wrap alphabet. */
ol.wrapAlphabet {
    list-style-type: lower-alpha;
    counter-reset: item;
    margin-left: 0;
    padding-left: 0;
    margin-top: 5px;
    padding-left: 40px;
}

ol.wrapAlphabet li {
}

ol.wrapAlphabet li:before {
    display: inline-block;
    content: "(";
    counter-increment: item;
    width: 2em;
    margin-left: -1.75em;
}
ol.wrapAlphabet li:after {
    display: inline-block;
    content: ")";
    counter-increment: item;
    width: 2em;
    margin-left: -3.5em;
}
​

演示:http: //jsfiddle.net/x5Rwv/


如果您使用的是更好的现代浏览器(我假设),您可以简单地替换:

content: "("counter(item)";

和:

content: "("counter(item, lower-alpha)")";

演示:http: //jsfiddle.net/x5Rwv/1/

于 2012-11-19T04:52:09.330 回答