Anchors nor ID work to reference a specific section on a page
I've been trying to use anchor tags and ID's to reference specific sections within a page but for some reason all I get back is a blank page. No matter how many different configurations I try, the most I get to work is just one link, and then the second displays just a blank page.
Been trying <a href>
, <a name>
and using the <div ID="">
but nothing seems to work. Any ideas?
Here's the link and section code:
<li>
<a href="servicios.html#distro">Distribución del espacio</a>
</li>
<section id="distro" class="section-block replicable-content bkg-charcoal color-white no-padding-bottom">
<div class="row horizon" data-animate-in="preset:slideInRightShort;duration:1000ms;" data-threshold="0.3">
<div class="column width-5 offset-2">
<h2 class="mb-30"><a name="#distro">Distribución del espacio</a></h2>
</div>
...
See website here
Check the menu option under "Servicios"
BTW Also been using href instead of name in the anchor to no avail.
This will open the page servicios.html
and then go to the anchor #distro
:
<li>
<a href="servicios.html#distro">Distribución del espacio</a>
</li>
This will go straight to the anchor:
<li>
<a href="#distro">Distribución del espacio</a>
</li>
Make sure you only have one id distro
<section id="distro" ... >
You can also try:
<section name="distro" ... >
But the browser will first look for the id and then the name. HTML Anchors with 'name' or 'id'?
<a href="#distro">Distribución del espacio</a>
<section id="distro" class="section-block replicable-content bkg-charcoal color-white no-padding-bottom">
<div class="row horizon" data-animate-in="preset:slideInRightShort;duration:1000ms;" data-threshold="0.3">
<div class="column width-5 offset-2">
<h2 class="mb-30"><a href="#distro">Distribución del espacio</a></h2>
</div>
...
You need to use href
on the anchor, not name
. And if the target is on the same page, you do not need to name the whole file in href
, just the fragment starting with the hash sign.
Thank you everyone for all your kind responses. Turns out the key to this puzzle was that some sections were not defined as such but as only as divs. By making all of them separate sections, I got everything to work as needed.
Appreciate your support!
链接地址: http://www.djcxy.com/p/89018.html上一篇: 什么是多边形文档?
下一篇: 锚和编号工作以引用页面上的特定部分