我有一个< div>它在背景中有一个图像.
现在我想将一个列表放入该Div中,那么我该如何定位呢?
现在我想将一个列表放入该Div中,那么我该如何定位呢?
http://i.stack.imgur.com/VWmB2.png
你可以在上面的图片中看到我有背景和列表,但我无法定位它.
我的守则
<div id="footer"> <div id="footer-content"> <div id="footer-list"> <ul> <li><a href="#home">Home</a></li> <li><a href="#news">Blog</a></li> <li><a href="#contact">About FF</a></li> <li><a href="#about">FAQ</a></li> <li><a href="#about">How To Play</a></li> <li><a href="#about">Terms of Use</a></li> <li><a href="#about">Privacy Policy</a></li> </ul> </div> </div> </div>
css–
#footer-list ul { list-style-type: none; margin: 0; padding: 0; margin-left: 500px; margin-top: 100px; } #footer { background-image: url(/img/footer.png); height: 140px; width: 1820px; background-repeat: no-repeat; left:0px; bottom: 0px; }
我的CSS的问题是当我给’margin-top:100px’到ul时它会下降但背景图片也会下降.
那么如何在div中定位列表呢?
解决方法
我想这就是你想要的.当你使用< ul>你不能使用< div>在里面.所以结帐这个
#footer-content ul { list-style-type: none; margin: 0; padding: 0; margin-left: 500px; } #footer-content ul li { display: inline; } #footer { background-image: url('http://i.stack.imgur.com/VWmB2.png'); height: 140px; width: 1820px; background-size: 1820px 140px; background-repeat: no-repeat; left:0px; bottom: 0px; padding-top:50px; }
<div id="footer"> <div id="footer-content"> <ul> <li><a href="#home">Home</a></li> <li><a href="#news">Blog</a></li> <li><a href="#contact">About FF</a></li> <li><a href="#about">FAQ</a></li> <li><a href="#about">How To Play</a></li> <li><a href="#about">Terms of Use</a></li> <li><a href="#about">Privacy Policy</a></li> </ul> </div> </div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。