不确定为什么会发生这种情况，但是当尝试通过执行 margin:auto; 使 .front 居中时；它有点偏离中心。这是它的图片:
body{
font-family: 'Proza Libre', sans-serif;
background-color:#f7f3de;
overflow-x: hidden;
}
.para{
text-align:left;
position:relative;
display:inline;
right:-100px;
}
.links{
text-align:center;
width:100%;
position:relative;
display:inline-block;
font-size:20px;
top:-50px;
word-spacing:30px;
}
.logo{
position:relative;
display:block;
float:right;
width:16%;
top:-100px;
right:100px;
}
.front{
position:relative;
top:70px;
display:block;
margin-left:auto;
margin-right:auto;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="beach.css">
<link href="https://fonts.googleapis.com/css?family=Proza+Libre"
rel="stylesheet">
<title>Lucas Essex</title>
</head>
<body>
<div class="para">
<h1>Beach Corp Inc.</h1>
</div>
<div class="links">
<a href="asdasd.com">FAQ</a>
<a href="asdasd.com">About</a>
<a href="asdasd.com">Social</a>
<a href="asdasd.com">Contact</a>
</div>
<div>
<img src="http://samuibeautifulbeachvillas.com/assets/samui-beautiful-
beach-villas.png" class="logo">
</div>
<div class="gang">
<img src="http://www.beaches.com/assets/img/home/rst-btc.jpg" class="front">
</div>
</body>
</html>最佳答案
因为你还没有给图片指定宽度。默认情况下， block 级元素的宽度为 100%，因此使用 auto 应用的任何边距都将为零。
关于html - 为什么我的 margin 是:auto; off-center?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46761034/