CSS 解决 HTML 大段文本没有换行问题
CSS HTML About 829 words问题
有一大段说明文字,已经分段落和换行好了,但是页面上去没有换行,而且空格也被去掉了。
解决方法
使用white-space
的pre-wrap
样式。
white-space: pre-wrap
white-space
pre-line
只允许换行,但是多个空格会只保留一个空格。
pre-wrap
允许换行,且保留多个空格。所见即所得。
<p>
你好,世界!
你好, CSS!
你好,JS
哈哈哈
</p>
<div style="width:100%;height:20px;background-color: red"></div>
<p style="white-space: pre-line">
你好,世界!
你好, CSS!
你好,JS
哈哈哈
</p>
<div style="width:100%;height:20px;background-color: red"></div>
<p style="white-space: pre-wrap">
你好,世界!
你好, CSS!
你好,JS
哈哈哈
</p>
<div style="width:100%;height:20px;background-color: red"></div>
<p style="white-space: nowrap">
你好,世界!
你好, CSS!
你好,JS
哈哈哈
</p>
Views: 492 · Posted: 2024-02-03
————        END        ————
Give me a Star, Thanks:)
https://github.com/fendoudebb/LiteNote扫描下方二维码关注公众号和小程序↓↓↓
Loading...