就像我在标题中说的那样,我正在尝试将菜单标题(它是图片)匹配到具有与菜单标题匹配的背景图片的ul的顶部。不管我尝试了什么,标题和ul之间仍然存在差距。抱歉,如果我感到困惑,这是代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
ul {
margin: 0;
padding: 10px 0px 25px 45px;
background:url(ul.png) no-repeat 0 100%;
list-style-image:url(li.png);
}
table td {
display: table-cell;
vertical-align: top;
}
ul li a:hover{
color: red;
padding-left: 10px;
}
img {
position: relative;
}
</style>
</head>
<body>
<table width="313" border="0">
<tr>
<td width="303" height="257"><img src="h3.png" width="224" height="35" alt=""/><ul>
<li><a href="#">Future</a></li>
<li><a href="#">Health</a></li>
<li><a href="#">Life</a></li>
<li><a href="#">Money</a></li>
<li><a href="#">Personal</a></li>
<li><a href="#">Phobias</a></li>
</ul></td>
</tr>
</table>
</body>
</html>
最佳答案
为了避免所有这些“空白问题”,请考虑包括Eric A制作的reset.css样式表。
您可以在这里抓取-> http://meyerweb.com/eric/tools/css/reset/reset.css
通过编写以下内容将其包括在您的<style>
之前:
<link rel="stylesheet" type="text/css" media="screen" href="YOUR_PATH/css/reset.css" />