将href链接到另一个HTML文档中的锚点并将其居中

Linking a href to an anchor in another HTML doc and centering it

本文关键字：文档 href 链接 另一个 HTML      更新时间：2023-09-26

我是web开发的初学者，我试图构建一个投资组合，但我在编码方面遇到了一个小问题。

我想将href标记链接到<div id>，但在另一个<html>中。另一个问题是，我希望它位于窗口的中心。

这是一个例子：

INDEX.html

<a class="thumbnail" href="features.html#Spread5">
        <img src="i/Thumbnail_13.png" width="200"/> 
        <h5 class="slug">Departments</h5>
        <p>Muscle Fitness Hers</p>
    </a>

FEATURES.html

<div class="thumbnailspread" id="Spread5">
        <img src="i/Spread_5.png" width="420"/> 
        <h5 class="slug">Departments</h5>
        <p>Natural Health Magazine</p>
    </div>

我之所以希望它居中，是因为我有一个导航工具栏，当你向下滚动一定量时（使用我在网上找到的脚本），它会粘在顶部。所以每次我点击<href>，导航都会在下一页覆盖它。

尝试在4个不同的html中使用多个div所以它不能像这个例子那样太具体：

function goToAnchor() {
window.location = "#center";
}

所以，也许我应该使用：

 window.location.href = "#"+anchor;

但我不确定这是否是正确的解决方案。

任何帮助都将不胜感激！

将当前HTML包装在div中并将链接居中。

<div class="container">
  <a class="thumbnail" href="features.html#Spread5">...</a>
</div>

在您的css文件中

.thumbnail {
  display: block;
  text-align: center;
}

Fiddle

相关文章：