草庐IT

html - 在没有 JavaScript 的情况下，如何自动对 HTML+CSS 中的交叉引用进行编号？

coder 2023-08-02 原文

在 LaTeX 中创建交叉引用的常用方法是放置一个 \label在你以后要引用的东西里面，然后使用\ref .例如，写 as we saw in Section~\ref{intro}在 LaTeX 源代码中可能会在最终输出中产生“正如我们在第 1 节中看到的那样”。是否可以仅使用 HTML 和 CSS 获得相同的效果？ CSS 的较新功能允许部分等自动编号，但我还没有找到任何可以让您从文档的其他地方引用这些计数器值的东西。

这是一个具体的例子:

<!DOCTYPE html>
<html>
<head>
    <title>Cross references</title>
    <meta charset="utf-8">
    <style type="text/css">
        body {
            counter-reset: section;
        }
        section > h1::before {
            counter-increment: section;
            content: counter(section) ". ";
        }
    </style>
</head>
<body>
<section>
    <h1 id="intro">Introduction</h1>
    <p>Pineapples contain essential vitamins.</p>
</section>

<section>
    <h1>Further discourse on pineapples</h1>
    <p>As we saw in Section ??, pineapples contain essential vitamins.</p>
</section>
</body>
</html>

在此示例中，所有部分标题都带有一个自动生成的编号。我想知道是否可以使用任何 HTML 标记或 CSS 样式来代替 ??这将插入对应于 #intro 的数字.

我意识到我可以使用 <a href="#intro">创建指向简介的交叉超链接，但我也想在链接文本中包含节号。

如果单独使用 HTML 和 CSS 无法做到这一点，是否有任何 JavaScript 库可以在文档中添加交叉引用？

最佳答案

对我来说(事后看来)这个问题的更好表达方式是“如何在不使用 JavaScript 的情况下访问由 CSS 自动生成的内容？”，并且这些问题是相关的:

看起来访问自动生成的计数器值即使使用 JavaScript 也不容易，没有它就不可能，所以这回答了我的问题。

W3C 中有许多文档讨论了计数器和生成的内容，但据我所知没有一个文档讨论从文档的其他部分引用生成的内容:

有 a note in the W3C's List of suggested extensions to CSS这恰好提到了交叉引用问题 - 它来自 1998 写的一封电子邮件，我还没有找到任何后续工作，所以我想这不是一个高优先级。 p>

更新

CSS Generated Content for Paged Media Module discusses cross references explicitly , 并描述了 target-counter 和 target-text 函数以使用 CSS 实现它们。然而，这是一份日期为 2011 年 11 月 29 日的工作草案；这些功能似乎没有在任何主流浏览器中实现。一个article from A List Apart讨论使用这些 CSS 功能使用一些随机的专有工具从 HTML 生成 PDF 电子书。

关于html - 在没有 JavaScript 的情况下，如何自动对 HTML+CSS 中的交叉引用进行编号？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16453488/

JavaScripthtmlsectioncodenoreferrer

有关html - 在没有 JavaScript 的情况下，如何自动对 HTML+CSS 中的交叉引用进行编号？的更多相关文章

  1. ruby - 如何从 ruby​​ 中的字符串运行任意对象方法？ - 2

    总的来说，我对ruby​​还比较陌生，我正在为我正在创建的对象编写一些rspec测试用例。许多测试用例都非常基础，我只是想确保正确填充和返回值。我想知道是否有办法使用循环结构来执行此操作。不必为我要测试的每个方法都设置一个assertEquals。例如:describeitem,"TestingtheItem"doit"willhaveanullvaluetostart"doitem=Item.new#HereIcoulddotheitem.name.shouldbe_nil#thenIcoulddoitem.category.shouldbe_nilendend但我想要一些方法来使用

  2. ruby - 其他文件中的 Rake 任务 - 2

    我试图在一个项目中使用rake，如果我把所有东西都放到Rakefile中，它会很大并且很难读取/找到东西，所以我试着将每个命名空间放在lib/rake中它自己的文件中，我添加了这个到我的rake文件的顶部:Dir['#{File.dirname(__FILE__)}/lib/rake/*.rake'].map{|f|requiref}它加载文件没问题，但没有任务。我现在只有一个.rake文件作为测试，名为“servers.rake”，它看起来像这样:namespace:serverdotask:testdoputs"test"endend所以当我运行rakeserver:testid时

  3. ruby-on-rails - Ruby net/ldap 模块中的内存泄漏 - 2

    作为我的Rails应用程序的一部分，我编写了一个小导入程序，它从我们的LDAP系统中吸取数据并将其塞入一个用户表中。不幸的是，与LDAP相关的代码在遍历我们的32K用户时泄漏了大量内存，我一直无法弄清楚如何解决这个问题。这个问题似乎在某种程度上与LDAP库有关，因为当我删除对LDAP内容的调用时，内存使用情况会很好地稳定下来。此外，不断增加的对象是Net::BER::BerIdentifiedString和Net::BER::BerIdentifiedArray，它们都是LDAP库的一部分。当我运行导入时，内存使用量最终达到超过1GB的峰值。如果问题存在，我需要找到一些方法来更正我的代

  4. ruby-on-rails - Rails 3 中的多个路由文件 - 2

    Rails2.3可以选择随时使用RouteSet#add_configuration_file添加更多路由。是否可以在Rails3项目中做同样的事情？ 最佳答案 在config/application.rb中:config.paths.config.routes在Rails3.2(也可能是Rails3.1)中，使用:config.paths["config/routes"] 关于ruby-on-rails-Rails3中的多个路由文件，我们在StackOverflow上找到一个类似的问题

  5. ruby - 使用 ruby​​ 将 HTML 转换为纯文本并维护结构/格式 - 2

    我想将html转换为纯文本。不过，我不想只删除标签，我想智能地保留尽可能多的格式。为插入换行符标签，检测段落并格式化它们等。输入非常简单，通常是格式良好的html(不是整个文档，只是一堆内容，通常没有anchor或图像)。我可以将几个正则表达式放在一起，让我达到80%，但我认为可能有一些现有的解决方案更智能。 最佳答案 首先，不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案，它会随着HTML的变化而崩溃，或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h

  6. ruby - 难道Lua没有和Ruby的method_missing相媲美的东西吗？ - 2

    我好像记得Lua有类似Ruby的method_missing的东西。还是我记错了？ 最佳答案 表的metatable的__index和__newindex可以用于与Ruby的method_missing相同的效果。 关于ruby-难道Lua没有和Ruby的method_missing相媲美的东西吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/7732154/

  7. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前，我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它，但这似乎不是“ruby方式”，我将需要在不久的将来访问更多模型。这可能会变得很脏，是否有针对这种情况的任何技术？注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展，本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向，这似乎很麻烦。最终从任何

  8. ruby - capybara field.has_css?匹配器 - 2

    我在MiniTest::Spec和Capybara中使用以下规范:find_field('Email').must_have_css('[autofocus]')检查名为“电子邮件”的字段是否具有autofocus属性。doc说如下:has_css?(path,options={})ChecksifagivenCSSselectorisonthepageorcurrentnode.据我了解，字段“Email”是一个节点，因此调用must_have_css绝对有效!我做错了什么？ 最佳答案 通过JonasNicklas得到了答案:No

  9. ruby-on-rails - Rails 3.2.1 中 ActionMailer 中的未定义方法 'default_content_type=' - 2

    我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他，以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时，出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer

  10. ruby-on-rails - rails 目前在重启后没有安装 - 2

    我有一个奇怪的问题:我在rvm上安装了ruby​​onrails。一切正常，我可以创建项目。但是在我输入“railsnew”时重新启动后，我有“程序'rails'当前未安装。”。SystemUbuntu12.04ruby-v"1.9.3p194"gemlistactionmailer(3.2.5)actionpack(3.2.5)activemodel(3.2.5)activerecord(3.2.5)activeresource(3.2.5)activesupport(3.2.5)arel(3.0.2)builder(3.0.0)bundler(1.1.4)coffee-rails(

随机推荐