我的代码中的所有链接都有效,但这些链接除外

All links in my code work except these ones

这是我的 html 代码

<header>
    <div class="logo">
        <a href=""><img src="Images/samsung-logo.png" alt="Samsung Logo" width="150"></a>
        <ul class="menubalk">
            <a href=""><li>Contact</li></a>
            <a href="#assortiment-scroll"><li>Assortiment</li></a>
        </ul>
    </div>
</header>
<div class="bg">
        <video src="videos/S22-Ultra-unboxing.mp4" muted loop autoplay></video>
        <div class="bg-text">Nieuwe S22 Ultra</div>
        <a href=""><div class="bg-text-url">Discover</div></a>
</div>

最后一个 link 和 class="bg-text-url" 有效,但前 3 个无效。 我是没看到什么还是...

编辑:当我第一次开始这个项目时,它确实有效。从那以后,我没有对 header 进行任何更改。

为了更简单:https://jsfiddle.net/x7ewtvqu/

您的锚标记不起作用的原因是结合使用 display: inline; 样式和 position: absolute;。要解决此问题,请将您的样式更新为准确到 this JSFiddle。我还纠正了你的一些语法。

<header>
    <div class="logo">
        <a href=""><img src="Images/samsung-logo.png" alt="Samsung Logo" width="150"></a>
        <ul class="menubalk">
            <li><a href="#">Contact</a></li>
            <li><a href="#">Assortiment</a></li>
        </ul>
    </div>
</header>
<div class="bg">
   <video src="videos/S22-Ultra-unboxing.mp4" muted loop autoplay></video>
   <div class="bg-text">Nieuwe S22 Ultra</div>            
   <div class="bg-text-url"><a href="#">Discover</a></div>
</div>

在此上下文中不允许元素 a 作为元素 ul 的子元素。 此外,当您使用 div 元素时 a 不允许作为父子元素。

  1. a 标签中使用 div 在语义上不正确。你应该使用 span 标签。

  2. 不要在 a 标签中使用 li。在 li 标签中使用 a

  3. 如果您想在 a 标签中使用 div,只需使用:

    <div style="cursor: pointer;" onclick="window.location='http://google.com';">
    Hello world
    </div>
    

或使用:

<a href="http://google.com">
    <span style="display: block;">
        Hello world
    </span>
</a>

<header>
        <div class="logo">
        <a href=""><img src="https://media.istockphoto.com/vectors/abstract-business-arrow-up-logo-icon-vector-design-template-vector-id1140553971?k=20&m=1140553971&s=612x612&w=0&h=7-a1JjWAf8c5qKF46FRgdFg-3jva9qo80hqh0z_Y34A=" alt="Samsung Logo" width="150"></a>
        <ul class="menubalk">
            <li><a href="#">Contact</a></li>
            <li><a href="#assortiment-scroll">Assortiment</a></li>
        </ul>
    </div>
</header>

<div class="bg">
        <video src="videos/S22-Ultra-unboxing.mp4" muted loop autoplay></video>
        <div class="bg-text">Nieuwe S22 Ultra</div>
        <a href="#"><span class="bg-text-url">Discover</span></a>
</div>