我是 html 和 css 的新手，我已经开始制作一个网站，所以我开始正确放置 Logo 和背景，现在的问题是我无法垂直将我的 Logo 图像居中。
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Insert title here</title>
</head>
<body>
<div class="bg">
<div class="menu">
<div class="logo"></div>
</div>
</div>
</body>
</html>
CSS:
body {
background:url(../img/bg.png) no-repeat center center fixed;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
z-index:1000;
}
body {
margin:0 ;
padding:0;
height: 100%;
width: 100%;
}
.menu {
background:url(../img/MenuBar.png) ;
height:150px;
width:1242px;
position:relative;
}
.logo {
background:url(../img/Untitled-1.png) no-repeat center;
width:262px;
height:80px;
margin:0 auto;
}
最佳答案
这应该可以解决问题。
.menu {
background:url(../img/MenuBar.png) ;
height:150px;
width:1242px;
position:relative;
display: table;
.logo{
background:url(../img/Untitled-1.png) no-repeat center;
width:262px;
height:80px;
margin:0 auto;
display: table-cell;
vertical-align: middle;
关于html - 图片不在CSS中居中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22467872/