logo标签列表

如何将href链接显示为文本？

htmlanchorhref
13

我想得到与下面相同的结果，但是不要有重复（相同的链接出现两次）：

<html>
<body>
<a href="http://www.w3schools.com">http://www.w3schools.com</a>
</body>
</html>

不使用Javascript，在静态HTML中是否可能？

不。您必须包括要单击的文本和URL。如果只有您访问了该网站：http://www.w3schools.com/tags/tag_a.asp - iambriansreed
5个回答
10

你可以使用CSS选择器和CSS中的attr函数来避免重复。

在你的样式表中添加如下内容：

a::after {
    content: attr(href);
}

针对你在问题中提出的例子：

<html>
<style>
a::after {
        content:  attr(href);
}
</style>
<body>
    <a href="http://www.w3schools.com">Some text</a>
</body>
</html>

在某些文本之后，它会显示链接。

5
HTML标准 (a) 只允许在 href URL 中放置特定的内容，而 "请使用文本描述作为链接" 标记并不是其中之一。
你说得没错，这将节省很多重复工作，但大多数人可能认为链接的文本描述应该比链接本身更容易阅读。例如，您不希望在网页上看到以下内容：

http://www.google.com/patents?id=vmidAAAAEBAJ&printsec=frontcover&dq=database&hl=en&sa=X&ei=tN-0T-TtKu3TmAWNq7DiDw&ved=0CDUQ6AEwAA

话虽如此，你 可以 通过CSS来实现，具体方法是使用 after 在文档中添加包含文本 href 属性的元素。建议将其限制为特定的类，以便您不会修改每个 a 标签，例如：
<html>
    <style>
        .add-link::after {
            content: " (" attr(href) ")";
        }
    </style>
    <body>
        <a class="add-link" href="http://www.example.com">Link added</a>
        <p />
        <a href="http://www.example.com">No link added</a>
    </body>
</html>

第一个链接会添加链接文本，第二个不会。不幸的是，这并不能解决将巨大的URI（如上所述）作为文本放置在页面上的问题，但是你至少可以选择在那些上不附加add-link类。
(a): HTML5标准在此处指定A元素，URI规范在此处。
2
您需要使用JavaScript或保留原样，否则无法实现。
-1

不，只有静态HTML无法去除重复。

而且也没有必要。许多网页使用PHP或类似的东西，用PHP创建链接很容易 :)

PHP示例：

<a href="<?php echo $item->link; ?>"><?php echo $item->link; ?></a>
-4

实际上格式化链接的好方法是：

<html>
<body>
<a href="http://www.w3schools.com">w3schools.com</a>
</body>
</html>
1
很不幸，您仍然有重复的部分... :( - Ali
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接