How can I display the href as the text too?

Question

I would like to get the same result as below but without the duplication (the same link appears twice):

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

Is it possible in static HTML without Javascript?

Siham · Accepted Answer

You can do this without duplication using CSS selectors, by using the attr function in CSS.

In your style sheet you can add this:

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

For your example in the question:

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

And it displays the link after Some text.

Donate For Us