0

使用下面的 css 样式将水平显示锚标记列表。

但是，我似乎无法在每个列表项中垂直显示图像和文本。关于如何做到这一点的任何建议。

谢谢

我对问题的解决方案

<html>
<head>
<style type="text/css">
li
{
display:inline;
}

table
{
display:inline;
}
</style>
</head>
<body>
<ul> 
<li>
<table>
<tr><a href="#"><img /></a></tr>
<tr><a href="#">one</a></tr>
</table>
</li> 
<li>
<table>
<tr><a href="#"><img /></a></tr>
<tr><a href="#">two</a></tr>
</table>
</li> 
<li>
<table>
<tr><a href="#"><img /></a></tr>
<tr><a href="#">three</a></tr>
</table>
</li> 
<li>
<table>
<tr><a href="#"><img /></a></tr>
<tr><a href="#">four</a></tr>
</table>
</li> 
<li>
<table>
<tr><a href="#"><img /></a></tr>
<tr><a href="#">five</a></tr>
</table>
</li>
</ul>
</body>
</html>
4

2 回答 2

0

您可以<br />在文本之前添加，如下所示：

<ul>
  <li><a href="#"><img /><br />one</a></li>
  <li><a href="#"><img /><br />two</a></li>
  <li><a href="#"><img /><br />three</a></li>
  <li><a href="#"><img /><br />four</a></li>
  <li><a href="#"><img /><br />five</a></li>
</ul>

并将 CSS 更改为：

li {
  display: inline-block;
  list-style-type: none;
}
于 2012-05-29T17:17:34.893 回答
0

图片的高度都一样吗？如果是这样，您可以将line-height值应用于li a规则。您可能不得不摆弄它才能找到正确的值，但这会奏效。

于 2012-05-29T17:22:44.887 回答