Html 链接(<;a>;)没有';不要在绝对位置处理图像

Html 链接(<;a>;)没有';不要在绝对位置处理图像,html,css,Html,Css,链接行44仅在我从图像中删除“绝对位置”时起作用。 我尝试了opera、firefox、IE、safary和chrome 我试图改变我的链接的z-索引,但没有任何结果 您可以在此处下载图像和代码来查看此问题: 我还直接在本页上复制/传递代码: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Document sans nom</title> <

链接行44仅在我从图像中删除“绝对位置”时起作用。 我尝试了opera、firefox、IE、safary和chrome

我试图改变我的链接的z-索引,但没有任何结果

您可以在此处下载图像和代码来查看此问题:

我还直接在本页上复制/传递代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document sans nom</title>

<style>

section>img:first-child
{
    position:absolute;
    left:0px; top:0;
}

section>img:nth-child(2)
{
    position:absolute;
    right:0px; top:0;
}

article
{
    padding:50px;
}

a
{
    z-index:10;
}

</style>

</head>

<body>

        <section>

            <img alt="article_end" src="main_top_left.png"/>
            <img alt="article_end" src="main_top_right.png"/>


            <article>
              <a href="www.google.fr">LINK</a> 
            </article>

        </section>   

</body>
</html>

无名称文件
章节>img:第一个孩子
{
位置:绝对位置;
左:0px;上:0;
}
章节>img:第n个孩子(2)
{
位置:绝对位置;
右:0px;顶部:0;
}
文章
{
填充:50px;
}
A.
{
z指数:10;
}

Z-index将仅适用于已设置的元素
位置:绝对
位置:相对
;所以,为了让你的链接“在”你的图片之上,你应该给它一个位置:相对

工作示例:


另请参见

请发布您希望修复的代码和有效问题。用户不必下载内容来帮助您解决问题。您到底想完成什么?另外,
z-index
对没有css定位的元素不起作用。绝对定位是一种非常糟糕的网页布局方法。这是非常不灵活的,有更好的和更具响应性的选择添加一个位置到我的链接修复了这个问题!谢谢!谢谢Paulie的链接,我现在就检查一下