当前位置: 首页 > 面试题库 >

如何给列表样式类型的自动生成的数字上色?

柳奇希
2023-03-14
问题内容

我正在使用以下列表:

<ol id="footnotes">
    <a name="footnote1"><li></a>This is the first footnote...</li>
    <a name="footnote2"><li></a>This is the second footnote...</li>
</ol>

使用以下.css:

#footnotes {list-style-type: decimal;
            list-style-color: #f90;
            }

#footnotes li
           {color: #000;
            }

#footnotes a li,
#footnotes li a
           {color: #f90;
            }

目的是使li / footer文本本身为黑色(#000),数字样式为橙色(#f90)。

我尝试使用该list-style-color属性,但这除了使Web开发人员工具栏(在FF3.0.8 / Ubuntu
8.04中不可用)之外没有任何作用,Midori同样不会以橙色显示该数字(我想我会在Webkit引擎中尝试使用它,以防万一…)。

有任何想法吗?

编辑了HTML(因为我记得该标记不一定需要包含任何内容即可用作锚点):

<ol id="footnotes">
    <li><a name="footnote1"></a>This is the first footnote...</li>
    <li><a name="footnote2"></a>This is the second footnote...</li>
</ol>

对于那些建议<span><li>… 内使用内幕的回应。发生这种情况,尽管我感谢您的建议和所花费的时间,但是我一直在寻找(我是…的li’l
standardista))一种更…语义的选择。

实际上,我想我可能会使用这种方法。尽管我接受一个不同的答案,但皮特·米肖(Pete Michaud)的答案,是因为其内容丰富。谢谢!


问题答案:

好吧,最重要的是数字是在内技术生成的<li>,因此您对进行的任何操作<li>都会影响该数字。从规格:


CSS中大多数块级元素都会生成一个主体块框。在本节中,我们讨论两种CSS机制使一个元素生成两个框:一个主体块框(用于元素的内容)和一个单独的标记框(用于装饰)例如子弹,图片或数字)。”

请注意,标记框和主体框都属于同一元素-
在这种情况下,是列表项。因此,我们应该期望所有<li>样式都适用于标记和内容。如果您将其视为列表项本身正在生成编号内容(实际上是用CSS术语执行),这也就不足为奇了。以后在规格继续时将对此进行确认:

“列表属性允许列表的基本视觉格式。与更通用的标记一样,具有’display:list-
item’的元素会生成元素内容的主体框和可选的标记框。其他列表属性允许作者指定标记类型(图像,字形或数字)及其相对于主体框的位置(位于内容框外部或位于内容框内),不允许作者为字体指定不同的样式(颜色,字体,对齐方式等)列出标记或相对于主体框调整其位置。”

因此,由于标记属于列表,因此它会受到<li>样式的影响,并且不能直接调整。实现标记不同样式的唯一方法是<span>在列表项中插入一个内部,并用您想要与标记不同的属性来设置范围。



 类似资料:
  • 问题内容: 有没有一种方法可以在HTML中用破折号(即-或- 或- )创建列表样式,即 输出: 尽管我不知道该选项的弊端,但我想使用类似的方法来做到这一点(并且有很多反馈的义务)。 更笼统地说,我不介意知道如何将通用字符用于列表项。 问题答案: 您可以使用并记住IE 7或更低版​​本不支持此功能。如果您对此表示满意,那么这是您最好的解决方案。有关完整详细信息,请参见“ 我可以使用”或QuirksM

  • 假设您在python中输入了一个数字,并且希望生成一个连续数字列表,最多为,如 你怎么能这么做?

  • 问题内容: 是否可以 仅 在有序列表上设置样式或增加数字的大小? 我打算仅使用CSS 将有序列表转换为wikihow步骤。 问题答案: 可以使用CSS3来完成,但不能使用100%跨浏览器(即IE7)来完成。使用伪:before元素以及counter-reset和counter- increment,您可以隐藏列表样式并创建自己的样式。 同样在可怕的链接腐烂的情况下-这是所需的主要CSS代码(可以应

  • 问题内容: 假设您在python中输入了数字,并且想生成一个连续数字列表,例如 你怎么能这样 问题答案: 在Python 3中,您可以像这样使用内置函数 注意1: Python 3.x的函数返回一个对象。如果需要列表,则需要使用答案中所示的功能将其显式转换为列表。 注意2: 我们将数字9传递给函数,因为,函数将生成直到给定数字但不包括数字的数字。因此,我们给出实际数字+ 1。 注意3: Pytho

  • Spring4包含了对泛型类型解析的主要增强,但当包含bean类的type参数被参数化时,我无法自动生成泛型类型。 我需要跟踪提交给外部服务的作业的状态,并且我想在每个作业启动时为其创建一个条目,并在收到回发时清除或更新它。我通常会尝试将持久性策略与服务接口分开,因此我有一个接口,一个Spring数据Mongo类。由于作业可能会在外部服务有机会为其分配ID(例如HTTP 502)之前失败,因此我需

  • 我正在尝试使用@ManyToOne和@OneToMany映射实体表。映射列位于名为“internal_plan_id”的子表中。根据要求,我不能更改名称。下面是两个实体表:父表 儿童桌: 我得到错误为:错误:关系“financial_plan_subplan”的列“internal_plan_id_internal_plan_id”不存在。 financial_subplan中用于映射的现有列名是