Question

我在侧边栏的this网站上有一个锚点。当我点击链接时，它会转到右侧页面，锚点也可以，但我的菜单位于主页的顶部，因此您无法看到标题。我如何解决这个问题，以便用户可以看到标题？

  <h3><a href="/Structuur-te-huur">Structuur te huur</a></h3>
<ul>
    <li><a href="/Structuur-te-huur/#structuur-te-huur">Structuur te huur</a></li>
    <li><a href="/Structuur-te-huur/#procesbegeleiding">Procesbegeleiding</a></li>
    <li><a href="/Structuur-te-huur/#projectmanagement">Projectmanagement</a></li>
    <li><a href="/Structuur-te-huur/#training">Training</a></li>
</ul>

CSS

#secondary .widget ul, #footer-widgets .widget ul{
    list-style-type: '- ';
    color: #fff;
    padding: 20px;
    margin: 0;
}
#secondary .widget ul li a {
    color: #fff;
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 300;
    letter-spacing: 1.3px;
}
#secondary .widget h3{
    padding: 20px;
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 800;
}
/* widget paars*/
#secondary .widget:nth-child(2),
#secondary .widget:nth-child(7){
    background: #B167B3;
}
#secondary .widget:nth-child(2) h3,
#secondary .widget:nth-child(7) h3{
    background: #A263A4;
}
/* Oranje*/
#secondary .widget:nth-child(3){
    background: #FF9D29;
}
#secondary .widget:nth-child(3) h3{
    background: #FA9624;
}
/* Groen */
#secondary .widget:nth-child(4){
    background: #54D7C1;
}
#secondary .widget:nth-child(4) h3{
    background: #14C4A8;
}
/* Blauw */
#secondary .widget:nth-child(5){
    background: #63B9FC;
}
#secondary .widget:nth-child(5) h3{
    background: #36A6F6;
}
/* Rood */
#secondary .widget:nth-child(6){
    background: #F0524E;
}
#secondary .widget:nth-child(6) h3{
    background: #ED413A;
}

Answer 1

在您跳转到的位置顶部添加一些顶部填充，以便您的菜单不会覆盖它，或者在此问题中使用javascript ... Make anchor link go some pixels above where it's linked to

如果它不会对你的设计造成太大伤害，那么填充可能是最好的选择 - 不需要添加不必要的javascript。

锚链接位置 - Wordpress

1 个答案: