很长的单词没有包装在HTMLCSS中

概述我有一个问题,如果用户输入一个长注释/单词,如’coooooooooooooooooooooooooooooooooooooooool’,这将打破页面上的格式. 下面是一张图片,用于帮助解释场景(不按比例)以及使用的代码： HTML： <div class="comment-content"> <p>cooooooooooooooooooooooooooooooooooooooool</p 我有一个问题,如果用户输入一个长注释/单词,如’coooooooooooooooooooooooooooooooooooooooool’,这将打破页面上的格式.

下面是一张图片,用于帮助解释场景(不按比例)以及使用的代码：

HTML：

<div >    <p>cooooooooooooooooooooooooooooooooooooooool</p>    <br />    <a  data-delete-comment-ID="28" href="/">Delete</a></div>

CSS：

.comment-content{    wIDth: 525px;     margin: 13px 25px 0 0;}.comment-content p{    wIDth: 525px;}

我想知道是否有一个快速解决方案,而不会更改太多的标记和CSS,因为这是代码区域,我们不希望通过更改应用程序代码(用ASP.NET / MVC 3编写)引入错误.

如果CSS / HTML不是一个选项,我猜HTML 5< wbr>标签可用于在“x”字符数量之后分隔单词 – 唯一的问题是该网站是9种语言的多语言.日语和中文例如文本字符明显大于英文文本字符,在添加< wbr>之前需要多个条件代码才能获得字符数.或字体大小减少.刚刚提出最佳解决方案的建议之后.

非常感谢

解决方法 试试这个

.comment-content p {    word-wrap: break-word;}

Live Demo

More Information

总结

以上是内存溢出为你收集整理的很长的单词没有包装在HTML / CSS中全部内容，希望文章能够帮你解决很长的单词没有包装在HTML / CSS中所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。