Question

我试图为不同的div分配不同的锚点，但它们似乎并没有生效。我尝试过使用<a name="anchor">，<a id="anchor">和<div id="anchor">（与某些div合作，但不是全部）。

这是我目前的HTML：

＆＃13;

<div class="about">
  <a name="nabout"></a>
  <div class="section">

    <div class="section-title job-section-header section-header section-subheader">
      <div class="section-bar"></div>
      <img src="images/about-photo.png" class="left-image" />
    </div>
    <div class="section-body jobs">
      <p class="section-subtext-md section-subtext section-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis lobortis nulla a eros porttitor, ut congue elit commodo. Nunc ut dapibus elit. Suspendisse euismod rhoncus felis, id vulputate mauris posuere vitae. Praesent bibendum maximus nibh, nec
        tempor diam blandit in. Praesent non metus in odio vehicula cursus vulputate quis quam. Nulla varius massa ac libero commodo imperdiet. Fusce tincidunt metus sapien, sed fringilla nibh vulputate eget. Suspendisse sodales nisi quis hendrerit porttitor.
        Morbi in augue sapien. Maecenas ultricies, nisl vitae vehicula vulputate, nunc tellus sagittis turpis, nec laoreet quam velit non nunc. In aliquam libero a tellus commodo, at aliquet risus imperdiet. Fusce finibus a nulla et facilisis. Maecenas
        condimentum sit amet velit et sodales. Duis mauris augue, feugiat non ornare pharetra, convallis nec metus. Integer vitae consequat dolor, at tristique lorem.</p>

      <p class="section-subtext-md section-subtext section-text">Cras libero massa, fringilla id condimentum ut, aliquam ut nisi. Vestibulum ullamcorper commodo elit at commodo. Nullam dignissim id lacus sed faucibus. Quisque sollicitudin quam sit amet est facilisis tempor. Morbi vehicula quam et mauris faucibus
        semper. Etiam vel est eu magna viverra viverra. Donec venenatis, nisl eget rhoncus auctor, lorem est gravida magna, ac consectetur velit libero at turpis. Vivamus at quam sed arcu eleifend suscipit non id mauris. Pellentesque tempor ornare imperdiet.
        Morbi ornare luctus imperdiet. Fusce sagittis lorem ut elementum fermentum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    </div>
    <div style="clear: both;"></div>
  </div>
</div>

＆＃13;

为什么<a name>有时不起作用，在这种情况下我应该使用什么？

Answer 1

HTML锚点的工作方式如下。

当您为div或任何其他DOM对象提供id属性时，您可以通过指定该ID来“链接”到该对象，#位于href 1}}，要有一个标签链接到该标签。

例如：

<强> HTML

<a href="#testing">Testing</a>

...

<div id="testing">
    <h1>Testing DIV</h1>
</div>

通过单击上面的<a>标记，用户的浏览器将滚动，直到#testing div的顶部位于页面顶部，假设浏览器有可以滚动的空间。

Answer 2

试试这个

<a href="#test">Test</a>

.........

<a name="test"></a>
<h1>Testing</h1>

或者

<a href="#test">Test</a>

    .......

    <div id="test">
        <h1>Test</h1>
    </div>

Answer 3

我不是百分之百确定为什么它没有跳转到加载位置，但如果你添加这个javascript

window.location.href = window.location.hash;

到页面底部，这应该可以解决您的问题。

HTML锚不起作用

3 个答案: