9

我正在尝试找到一种方法来允许 HTML 链接中的非常长的文本进行换行,同时将链接包含在一个紧凑的矩形中。

本质上,我想要这个:

                      真的,真的
    这是一些文本长链接,   这里是一些更多的文本。
                      在一个矩形周围

代替:

   这里有一些文本,链接非常长,环绕
   在一个矩形中,这里还有一些文本。

我怎样才能做到这一点?

4

4 回答 4

10

你可以在 Firefox 中这样做 - 但它在 IE 中不起作用:(

<p>Here is some text <a href="#">with a really, really long link that wraps</a> around in a rectangle and here is some more text.


<style type="text/css">

a {display: inline-block; max-width: 100px; vertical-align: middle;}

</style>
于 2009-03-14T20:38:39.160 回答
9

我知道这已经很老了,但它仍然是我在这个主题上出现的第一批搜索结果之一。我发现使用:

white-space: pre-wrap;

强制锚将文本围绕我的宽度限制

于 2014-10-21T19:56:32.933 回答
1

您可以display:inline-block;在链接上使用 css 属性,这将为您提供您想要的效果(不要忘记设置宽度:)。

IE 不支持 display:inline-block,但幸运的是,有人已经完成了艰苦的工作并在这里提出了解决方法。

于 2009-03-14T20:46:48.220 回答
1

我最终遇到了这个问题,因为我使用的是引导程序,默认情况下将其设置为其中一种样式

.dropdown-menu > li > a{
    white-space: nowrap;
}

这使得“word-break”和“width”css属性无法实际解决问题

所以我首先必须将该空白属性设置为“预包装”

于 2015-06-15T20:32:18.153 回答