我设计了一个 html 页面,但我的 href 和我的 youtube iframe 不让我点击

I designed an html page but my href and my youtube iframe isn't letting me click

我的网页只有一个 CSS 文件和一个 html 文件,我不知道为什么我不能点击这个嵌入的 YouTube link 或点击在“点击这里”a.href

https://codepen.io/deuelJordan/pen/XWgQGJK

        <iframe width="750" height="422" src="https://www.youtube.com/embed/rt-2cxAiPJk"
            title="YouTube video player" frameborder="0"
            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
            allowfullscreen>
        </iframe>

非常感谢

问题出在您的 CSS 部分。 如果你改变

z-index: -1;

z-index: 1;

您的页面将正常运行

只需评论或删除 z-index,如下所示:

.black-rect {
    background-color: rgb(0, 0, 0);
    border-radius: 10px;
    /* z-index: -1; */
    width: 1280px;
    height: 720px;
    position: relative;
    left: 125px;
}

您可以在 CodePen 上查看更新后的演示:
https://codepen.io/tibichi/pen/NWgmVOE

在此处查看 z-index 文档: https://developer.mozilla.org/en-US/docs/Web/CSS/z-index

你应该改变

z-index: -1; 

z-index: 1;

这将使您希望其他人访问的代码 link 生效。

如果还有什么我可以帮忙的,我很乐意帮忙! :)