【问题标题】:Force a line break in a div [duplicate]在div中强制换行[重复]
【发布时间】:2013-05-27 13:01:09
【问题描述】:

我在一个 div 中进行了一次聊天对话,但掉出了很长的词。有人建议我使用 i-frame,但是如何使用?我以为这是针对外部网站的。

jsFiddle Code

CSS

.chat{
   width: 230px;
   height: 310px;
   margin-left: 10px;
   background-color: grey;
   border: solid 1px black;
   color: #1855a3;
   overflow-y: scroll;
}

【问题讨论】:

  • @wesley - 我在阅读了重复的建议后删除了评论。看起来好多了

标签: html css


【解决方案1】:

尝试在你的css中添加word-wrap:break-word;

【讨论】:

  • 这很酷,谢谢!
【解决方案2】:

添加 CSS 规则:word-break:break-word;

jsFiddle example

【讨论】:

  • 与建议的副本相同。
【解决方案3】:

使用word-wrap: break-word; - 适用于所有浏览器。

http://jsfiddle.net/adamh/TWsqQ/5/

【讨论】:

  • 与建议的副本相同。
【解决方案4】:

我相信你想要做的是防止水平滚动。

您可以使用overflow-x: hidden;word-wrap: break-word; 轻松做到这一点,这样长单词就会换行。

CSS:

.chat{
   width: 230px;
   height: 310px;
   margin-left: 10px;
   background-color: grey;
   border: solid 1px black;
   color: #1855a3;
   overflow-y: scroll;
   overflow-x: hidden;
   word-wrap: break-word;
}

在此处查看示例: http://jsfiddle.net/TWsqQ/10/

【讨论】:

    猜你喜欢
    • 2017-08-07
    • 2013-07-10
    • 2011-03-04
    • 1970-01-01
    • 2021-08-24
    • 2011-09-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多