Question

我想创建一个如图所示的开场页面。在我的身体上，我想在中心放置一张照片。但我无法垂直居中。我不想使用固定高度，因为它需要在任何屏幕上工作。

<body>
    <div id="picture>
         <a id="link" href="...">Link</a>
    </div>
</body>

enter image description here

Answer 1

你可以试试这个：

<html>
<head>
<style>
#picture{
position:absolute;
width:300px;
height:200px;
z-index:15;
top:50%;
left:50%;
margin:-100px 0 0 -150px;
background:green;
}
</style>
</head>
<body>
<div id="picture">
<a id="link" href="...">Link</a>
</div>
</body>
</html>

Answer 2

在你的图片容器中使用它

#cont{
    margin:0 auto; 
    text-align:center;
}    
    

#cont div{
   display:inline-block;
}

<div id=cont>
    <a href=http://windesk.com.tr><img class="w3cLogo" src="http://windesk.com.tr/views/web/signum/img/windesk.png"></a>
</div>

中心图片和身体上的链接

2 个答案: