Question

我遇到一个问题，<p>或<div>的内容可以包含没有空格的长文本字符串。我想要做的是限制<p>或<div>的宽度，以便当文本宽度超过宽度时，它不会强制宽度比我指定的宽度宽。我尝试了各种我能想到的限制宽度的样式，但到目前为止还没有任何工作。

＆＃13;

<div style='100px;'>
  <p style="width: 100px;">
    ddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd
  </p>
</div>

＆＃13;

Answer 1

尝试使用属性自动换行：break-word; ，甚至 white-space：pre-wrap; 以便更好地使用。

Answer 2

有趣的是，我认为您需要的只是max-width属性，但是如果您的文本字符串没有宽于指定的max-width的空格，则会被忽略。因此，为了满足您的需求，您还必须拥有word-wrap: break-word;。这种组合将起作用。

p {
        max-width: 100px;
        word-wrap: break-word;
}

<div>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit.
  </p>

  <p>
    HereIsAnotherParagraphWithALongTextStringWithoutAnySpacesAndSeeHowItWordWrapsWithoutWideningTheParagraph.
  </p>
</div>

限制文本框的宽度

2 个答案: