1

好吧，有点愚蠢的问题，但我不能让它为我的生活工作。我正在尝试将文本放置在导航图像下方。

我尝试将文本放在跨度、段落中，甚至尝试过中断标签。

这是我的ul

<ul id="mainImg">
  <li><?=anchor('home/artwork', $art); ?></li>
  <li><?=anchor('home/comps', $des); ?></li>
  <li><?=anchor('home/sites', $web); ?></li>
</ul>

我正在使用 codeigniter，因此图像被存储在变量中，然后我将它们传递到上面的链接中，以便它们可以点击。

我在这三幅图像上的唯一样式是不透明度和显示：li 上的内联，以便它们彼此相邻。每次尝试将文本放在它们下方时，它也会将其余图像推送到下一行。如果可能的话，我想避免这种情况。

如果您想看看我想要完成的工作，我确实有一个现场站点。catlyndesigns.net 请记住，我目前正在重新编码该站点的整个后端，因此目前几乎没有任何工作。

谢谢你的帮助！:)

4

1 回答 1

1

改为使用display: inline-block。

示例： http ://codepen.io/jonjaques/pen/JvocB

请注意，我在锚标记内使用了 span，因为它更具语义性。你也可以使用<p>标签，重要的是包装文本的元素需要有display: block

于 2013-02-05T01:24:58.383 回答