如何在浏览器中将背景图像中的div居中？

Question

所以this website在背景图片中有内容，其中有一个正方形，但它没有居中。 在firefox中它太大了，在Chrome中它离左边太远，唯一的方法就是按ctrl +（这会使浏览器窗口变小），即使这样它仍然没有居中。 有人有解决方法吗？ 感谢。

Answer 1

您需要居中背景图片：

body {
    background: #000000 url(images/waves.jpg) center top repeat-x;
}

Answer 2

基本上如果你的html body标签中有另一个div或div内的div，如果所讨论的div有一个宽度定义，你只需要

.myDiv {
margin: 0 auto;
}

Answer 3

这将有效..

body {
    background: background: url(images/waves.jpg) center;
}

Answer 4

我个人使用百分比来居中背景图像：

background-position:50% 50%;

正文的完整代码：

body {
margin: 0;
padding: 0;
line-height: 1.5em;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
color: #989898;
background-image: url(images/waves.jpg);
background-position: 50% 50%;
}