javascript 如何在 <a> 标签中制作文字自动换行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8336729/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make text in <a> tag wordwrap
提问by hungneox
I want to make text in <a>tag fit in a fixed div, but it breaks the div and displays ugly.
我想让<a>标签中的文本适合固定的 div，但它破坏了 div 并显示丑陋。
回答by Chris Fulstow
There's a CSS3 property: word-wrap: break-word
有一个 CSS3 属性： word-wrap: break-word
Take a look at the MDN word-wrap docsfor more info.
查看MDN 自动换行文档了解更多信息。
回答by Subha
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
width: 30px;
}<pre><a href="#">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</a></pre>回答by Muhammad Usama
You can wrap text in a tagthrough the below css.
您可以通过以下 css将文本包装在标签中。
a {
/* These are technically the same, but use both */
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
/* This is the dangerous one in WebKit, as it breaks things wherever */
word-break: break-all;
/* Instead use this non-standard one: */
word-break: break-word;
/* Adds a hyphen where the word breaks, if supported (No Blink) */
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}
回答by Shafeeque Shaz
I got a solution to make word-wrap: break-wordeffective for Anchor tag in IE by setting the display:list-itemof the Anchor tag.
word-wrap: break-word通过设置 Anchor 标签的 ，我得到了一个使IEdisplay:list-item中的 Anchor 标签生效的解决方案。
