使用的是vue

• html

<div class="tttt">{{ text }}</div>

• js

export default {
  data() {
    return {
      text: '456你好放大地方撒你好放大地方撒你好放大地方撒你好放大地方撒你好放大地方撒你好放大地方撒你好放大地方撒\n123发哦南方的萨格发哦单反发哦南方的萨格发哦单反'
    }
  }
}

默认

• css

.tttt {
  width: 200px;
  height: 300px;
  border: 1px solid red;
}

• 效果
  

使用white-space: pre;

• css

.tttt {
  width: 200px;
  height: 300px;
  border: 1px solid red;
  white-space: pre;
}

• 效果
  

使用white-space: pre-wrap;

• css

.tttt {
  width: 200px;
  height: 300px;
  border: 1px solid red;
  white-space: pre-wrap;
}

• 效果