Question

在下面的代码片段中，有2个示例来演示我要完成的任务：

我希望我的顶级示例的行为与下面的示例相同，意味着它将保留在给定文本的2行中，问题是当我使用space时它会破坏行，我希望文本继续直到div的结尾，然后才打破。

任何css建议？

  .myClass{
      font-size: 10px;
      color: #9a9a9a;
      width: 160px;
      overflow: hidden;
      -ms-word-wrap: break-word;
      word-wrap: break-word;  
    }

  <body>
    <div class="myClass">
      WWWWWWWW WWWWWWWWWWWWWWWWWWWWWWWWW
    </div>
    
    <hr>
    <div class="myClass">
      WWWWWWWW WWWWWWWWW WWWWWWWWWWWWWWWW
    </div>
  </body>

Answer 1

您可以使用以下CSS

.myClass{
  font-size: 10px;
  color: #9a9a9a;
  width: 160px;
  overflow: hidden;
  word-break: break-all;
  word-wrap: break-word;
  display: block;
}

强制div中的文本只有在到达div的末尾后才会中断

1 个答案: