html – 无法识别CSS目标计数器属性

概述我正在尝试使用target-counter来描述引用. 我从List Apart article开始用HTML / CSS制作一本书时发现了它.只有one other StackOverflow question,它没有帮助我. Chrome,Firefox或Opera无法识别属性目标计数器,但在CSS2 spec中提及它,我找不到任何其他文档,说明它是否受支持.所以我不知道这是我的代码还是浏览器 @H_403_4@ 我正在尝试使用target-counter来描述引用.

我从List Apart article开始用HTML / CSS制作一本书时发现了它.只有one other StackOverflow question,它没有帮助我.

Chrome,firefox或Opera无法识别属性目标计数器,但在CSS2 spec中提及它,我找不到任何其他文档,说明它是否受支持.所以我不知道这是我的代码还是浏览器的责任.

您可以在this Dabblet snippet上查看代码,或查看下面的代码段.

我的HTML：

<h1 ID="foo">Root level</h1><p><a href="#bar">linking to bar</a> and stuff</p><h1 ID="bar">Second heading</h1><h2 ID="sub">Subhead</h2><p>hey there <a href="#foo">with a link to foo</a></p>

和CSS：

h1 {    counter-increment: section;}h1::before {    content: counter(section) ". ";}a::after {    content: leader('.') target-counter(attr(href),section);}

任何建议赞赏.

@H_403_4@解决方法 target-counter()是一个CSS3函数,而不是CSS2函数.它在您链接到的文档中这样说！

由于该功能是长期被遗忘的CSS3生成内容模块草案的一部分,因此您将找不到任何浏览器支持,因为当前实现仅支持level 2 Generated Content spec.这意味着当前浏览器仅支持使用2级attr( )函数与:: before和:: after伪元素的content属性.

此外,您链接到的ALA文章提到了Prince,这是一个用于将Web文档转换为带有CSS的分页文档的软件.正如我在another answer中提到的(其中的问题引用了相同的ALA文章！),您所指的打印样式可能仅支持并供Prince使用,而不是任何Web浏览器的打印功能.

@H_403_4@ @H_403_4@ @H_403_4@ @H_403_4@ 总结

以上是内存溢出为你收集整理的html – 无法识别CSS目标计数器属性全部内容，希望文章能够帮你解决html – 无法识别CSS目标计数器属性所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。