¿Cómo puedo establecer un enlace de anclaje a una sección específica en una página?

2 minutos de lectura

¿Como puedo establecer un enlace de anclaje a una seccion
señorp

Tengo una página, digamos página2, llena de varios <section>:

<section class="box special" id="section1">
 //
</section>
<section class="box special" id="section2">
 //
</section>
<section class="box special" id="section3">
 //
</section>
<section class="box special" id="section4" style="background:#3399ff;">
 //
</section>

Luego tengo otra página, la página 1, en la que quiero poner un enlace ancla.

    <ul class="actions">
        <li><a href="https://stackoverflow.com/questions/30156630/page2.php" class="button">Link to page2</a></li> 
   </ul>

Lo que estoy tratando de lograr es configurar estos enlaces de anclaje para llegar a un punto específico <section> en la página 2, no solo en la parte superior de la página 2. ¿Es eso posible? Y, si es así, ¿cómo?

  • has probado href="page2.php#section2?

    – sean

    10 mayo 2015 a las 21:05

  • Dos ejemplos a continuación son lo que están buscando.

    – Dan Cundy

    10 mayo 2015 a las 21:07

  • No, no estaba al tanto de eso, en realidad. Voy a intentarlo lo antes posible, gracias.

    – Señor P

    10 mayo 2015 a las 21:08

1647544386 748 ¿Como puedo establecer un enlace de anclaje a una seccion
shawn jacobson

Usar una etiqueta de anclaje

<a name="section1"><section ...></section></a>

Luego, en el enlace, agregue el ancla específica

<a href="page2.php#section1">Link</a>

Y como han sugerido los comentarios, si está usando HTML5 (y parece que lo está haciendo), puede eliminar la etiqueta de anclaje y simplemente usar la identificación del elemento de sección

<section id="section1">...

  • nota – en html5, el <a name=""> ya no es necesario ya que puede hacerlo con el id atributo en <section> stackoverflow.com/questions/484719/html-anclajes-con-nombre-o-id

    – sean

    10 mayo 2015 a las 21:07

  • Utilizando <a name=""> es bueno si, por ejemplo, tiene una identificación muy larga, pero quiere un nombre corto para el enlace.

    – Sumner Evans

    10 mayo 2015 a las 21:09


1647544387 962 ¿Como puedo establecer un enlace de anclaje a una seccion
Sumner Evans

Utilizar #{id} donde {id} es el valor de identificación de la sección a la que desea vincular. Por ejemplo

<a href="page2.php#section1" class="button">Link to page2</a>

te llevará a la section1 section de page2.


Otras lecturas:

MDN href documentación de atributos.

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad