像aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa这样的文本超过了div的宽度(比如200px),如何被包装?

我是开放的任何一种解决方案,如CSS, jQuery等。


当前回答

在HTML正文中尝试:

<table>
    <tr>
        <td>
            <div style="word-wrap: break-word; width: 800px">
                Hello world, how are you? More text here to see if it wraps after a long while of writing and it does on Firefox but I have not tested it on Chrome yet. It also works wonders if you have a medium to long paragraph. Just avoid writing in the CSS file that the words have to break-all, that's a small tip.
            </div>
        </td>
    </tr>
</table>

在CSS正文尝试:

background-size: auto;

table-layout: fixed;

其他回答

在HTML正文中尝试:

<table>
    <tr>
        <td>
            <div style="word-wrap: break-word; width: 800px">
                Hello world, how are you? More text here to see if it wraps after a long while of writing and it does on Firefox but I have not tested it on Chrome yet. It also works wonders if you have a medium to long paragraph. Just avoid writing in the CSS file that the words have to break-all, that's a small tip.
            </div>
        </td>
    </tr>
</table>

在CSS正文尝试:

background-size: auto;

table-layout: fixed;

我用过自举法。 我的html代码看起来像..

<div class="container mt-3" style="width: 100%;">
  <div class="row">
    <div class="col-sm-12 wrap-text">
      <h6>
        text content
      </h6>
    </div>
  </div>
</div>

CSS

.wrap-text {
     text-align:justify;
}

试试这个:

div {
    width: 200px;
    word-wrap: break-word;
}

试试这个CSS属性-

overflow-wrap: anywhere;

你可以像这样使用软连字符:

这将显示为

aaaaaaaaaaaaaaa-
aaaaaaaaaaaaaaa

如果装盒不够大,或者

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

如果是的话。