skip to Main Content

I want to add a "back to top" link after each header. To explain more clearly what I want:

h1::after {
  content: "<a href='#masthead'>--->Back to top</a>";
}

The text —>Back to top shows but not as a link

No JavaScript please, pure CSS if possible.

Any solutions for this?

Thanks, Jondo

2

Answers


  1. Unfortunately you cannot add links with CSS content. You’d need to add the links in the HTML directly if you are averse to using JavaScript.

    Login or Signup to reply.
  2. If you don’t want it to show as a link you can use CSS to remove everything that makes it obvious as a link.

    I.e see the CSS below

    h1::after {
      content: "<a href='#masthead'>--->Back to top</a>";
      text-decoration: none;
      cursor: default;
    }

    Ensure to change the color too. HTML <a> tags tends to have the default blue color

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search