HTML/CSS：在源代码中显示(部分)超链接目的地作为链接文本而不重复？

pftdvrlh 于 2023-10-21 发布在其他

关注(0)|答案(1)|浏览(97)

我想自动有一个使用（部分）作为链接文本的超链接目的地的风格，而无需手动在源代码中重复它。上下文：我使用Markdown文件（只有基本的HTML和CSS）来记录许多学术出版物的外部链接。例如，链接的外观和工作方式应该类似于journal.pbio.0020449，但不必在源代码中重复块journal.pbio.0020449。换句话说，我想自动使用超链接的目的地作为链接文本。如果可能的话，只显示最后一部分。这怎么可能呢？
到目前为止，我只实现了改变链接的外观：

<style>
  a.doi {color: red;}
</style>

<a class="doi" href="https://doi.org/10.1371/journal.pbio.0020449">journal.pbio.0020449</a>

css

来源：https://stackoverflow.com/questions/77315826/html-css-show-part-of-hyperlink-destination-as-link-text-without-repetition-i

1条答案

按热度按时间

kkbh8khc1#

您可以使用锚元素的after伪元素来显示href值。

<style>
  .doi::after {
    content: attr(href);
  }
</style>
<a class="doi" href="https://doi.org/10.1371/journal.pbio.0020449"></a>

然而，如果你的网站是为了广泛发布，我不推荐它，因为屏幕阅读器用户不一定会听到这个值。

赞(0）回复(0）举报 2023-10-21

我来回答

HTML/CSS：在源代码中显示(部分)超链接目的地作为链接文本而不重复？

1条答案

相关问题

热门标签

最新问答