是否可以仅使用CSS创建正到负的有序列表,而不包括零? 示例:
3. Highest
2. Higher
1. High
-1. Low
-2. Lower
-3. Lowest
我知道这种展示方式非常不寻常。目的是通过一个字段创建最喜欢和最不喜欢的列表。
一些技术背景:该字段是通过Joomla! CMS生成的,使用FLEXIcontent's Text Field。该字段被配置为能够接受多个条目,并且限制只能接受偶数个条目。用户需要为给定字段输入相等数量的优点和缺点。如果可能的话,我想能够完全控制CSS中的所有内容,以便不必创建模板覆盖。
我选择了这种方法,因为我不想要求一个集合使用多个字段。
我已经找到了各种样式数字的资源。我认为以下内容不起作用,因为我必须用PHP控制某些因素或者标记有限制:
<ol>
<li value=#>List Item</li> <!--needs value populated by PHP-->
</ol>
<ol reversed> <!--Stays positive and ends at 1-->
<li>Reversed List</li>
</ol>
<ol reversed start=2> <!--Can I control where to start based on number of children?-->
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
<li>List Item 4</li>
<li>List Item 5</li>
</ol>
如果任务完全不可能,基于子元素数量进行样式设计并以不同颜色标记前半部分和后半部分可能更加实际。尽管如此,仅使用CSS实现这一点仍然非常有趣。