Open In App

What is the use of “#” symbol in link URL ?

Improve
Improve
Like Article
Like
Save
Share
Report

Many of us may have observed the pound(#) sign in the URL while inspecting some web sites. It is not a simple regular character but has a special function. So first of all, it is called a named anchor or sometimes as a fragment. Named anchor or fragment is used to link to the part of the same web –page. We generally link one page to the other, but what if we have to link to some heading which is on the same web-page? Then, named anchor (#) comes into play.

Syntax: It will just point to the top of the same page because that anchor tag is not given any link.

<a href="#">Click me</a>

Example: For example, you have a very long web page with several headings to navigate into those heading directly this will be helpful. Then for pointing the user to that specific heading with the link, the link must include. So, basically to point the user to some specific heading we use the pound sign with the name of that heading in the anchor tag. When used empty with no other dub heading, the same link points to the top of the same page.

Note: Blank # sign will bring you nowhere, cause it is not linked to any id attribute.

  • Program:




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>link has a pound “#” sign</title>
        <style>
              
            h1 {
                color: green;
            }
              
            li {
                font-size: 16px;
                color: blue;
            }
        </style>
    </head>
      
    <body>
        <h1>GeeksforGeeks</h1>
        <b>A Computer Science Portal for Geeks</b>
        <ul>
            <li><a href="#learn">Learn</a></li>
            <li><a href="#contribute">Contribute</a></li>
            <li><a href="#explore">Explore</a></li>
        </ul>
        <div id="learn">
            <h4>Learn</h4>
            <p>
             A Computer Science portal for geeks. 
             It contains well written, well thought 
             and well explained computer science and 
             programming articles, quizzes and many more.
            </p>
        </div>
        <div id="contribute">
            <h4>Contribute</h4>
            <p>
             A Computer Science portal for geeks. 
             It contains well written, well thought 
             and well explained computer science and 
             programming articles, quizzes and many more.
            </p>
        </div>
        <div id="explore">
            <h4>Explore</h4>
            <p>
             A Computer Science portal for geeks. 
             It contains well written, well thought 
             and well explained computer science and 
             programming articles, quizzes and many more.
            </p>
        </div>
    </body>
      
    </html>

    
    

  • Output:


Last Updated : 27 Apr, 2020
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads