编辑背景图像答案

【问题标题】：Editing Background Image编辑背景图像
【发布时间】：2015-05-15 23:23:50
【问题描述】：

我需要做一些事情来修复我的背景。

1.) 我需要将它移到右侧，以便它与水平导航栏及其下方的图片完美对齐。 2.) 我需要将它向下移动，这样就不会在水平导航栏上方看到了。

背景图片只是棕色圆圈，里面有白色圆圈（见右图）。

这是我的完整代码：

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
<!--

#banner {width:100%}
#banner img {width:100%;height:auto}

nav {width:100%;display:block;}
nav ul {list-style-type:none;margin:0;padding:0;text-align:center;
background-color:#c0872e;}
nav li {display:inline-block;background-color:
#c0872e;font family:Georgia;}
nav a {line-height:35px; color:white; padding: 0 30px; font-size:22px;
font-family:Georgia; background-color:#c0872e;}
nav a:hover {text-decoration:none}

a{float:left;
margin-right:58px;
margin-left:58px;
color:#000;
text-decoration:none;
}

body {background-image: url("daikinbackground1.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}

-->
</style>

<meta charset="utf-8"/>
<title>daikininc.com</title>
</head>

<body>
<div id="body">
<header>
<div>
<div style="text-align:center" id="banner">
<title="daikinincbanner">
<img src="daikinbanner1.jpg" border="0" alt="daikinbanner1">
</div>
<!--
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="products.html">Products</a></li>
</ul>
</nav>
-->
<nav style="text-align:center">
<img style ="height:300px" width="1355" src="navbarimage1.jpg">
</nav>
<br>
<p style="text-align:center;font-family:WindsorDemi;">
<font size="4">
Welcome to daikininc.com! Home to the world's greatest 
eggorll wrappers and noodles.
</font>
</p>

<br><br><br><br><br><br><br><br><br>

</nav>
</header>

<section>
<aside>
</aside>
<article>
</article>

<footer>
</footer>

</div>

</body>
</html>

谢谢。

【问题讨论】：

我可以得到该网站的链接吗？
该网站尚未托管，您在图片中看到的就是我目前所拥有的所有内容。
实际上只是为了更深入地了解您的代码，您提供的内容并没有真正提供任何可行的东西。
希望对您有所帮助。我尝试在css中的“背景位置”之后添加margin-right和margin-left间距，但这只会向左或向右移动其他所有内容 - 而不是背景图像。

标签： html css image background

【解决方案1】：

CSS：

body {background-image: url("daikinbackground1.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 126px 50px;}

background-position 控制背景图像的 x 和 y 坐标。

【讨论】：