¿Cuál es el uso del símbolo «#» en la URL del enlace?

Es posible que muchos de nosotros hayamos observado el signo de libra (#) en la URL mientras inspeccionábamos algunos sitios web. No es un simple carácter regular sino que tiene una función especial. Entonces, en primer lugar, se llama un ancla con nombre o, a veces, como un fragmento. El ancla o fragmento con nombre se utiliza para vincular a la parte de la misma página web. Generalmente enlazamos una página con la otra, pero ¿y si tenemos que enlazar con algún encabezado que está en la misma página web? Luego, entra en juego el ancla con nombre (#).

Sintaxis: solo apuntará a la parte superior de la misma página porque esa etiqueta de anclaje no tiene ningún enlace.

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

Ejemplo: por ejemplo, tiene una página web muy larga con varios encabezados para navegar directamente a esos encabezados, esto será útil. Luego, para dirigir al usuario a ese encabezado específico con el enlace, el enlace debe incluir. Entonces, básicamente, para dirigir al usuario a algún encabezado específico, usamos el signo de libra con el nombre de ese encabezado en la etiqueta de anclaje. Cuando se usa vacío sin otro encabezado de doblaje, el mismo enlace apunta a la parte superior de la misma página.

Nota: el signo # en blanco no lo llevará a ninguna parte, ya que no está vinculado a ningún atributo de identificación.

  • Programa:

    <!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>
  • Producción:

Publicación traducida automáticamente

Artículo escrito por pcpiyush1106 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *