<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div style="width: 500px;height: 900px;border: 1px solid red;">
<div style="white-space: normal">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<hr >
<div style="white-space: nowrap">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<hr >
<div style="white-space: pre">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<hr >
<div style="white-space: pre-wrap">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<hr >
<div style="white-space: pre-line">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<hr >
<div style="white-space: break-spaces">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
</div>
</body>
</html>
每行的行首添加了空格
normal(默认):换行,不保留换行符,空格,制表符,行尾空格
no-wrap: 不换行,不保留换行符,空格,制表符,行尾空格
pre: 不换行,保留换行符,空格,制表符,行尾空格
pre-wrap: 换行,保留换行符,空格,制表符,行尾空格
pre-line: 换行,保留换行符,不保留空格,制表符,不保留行尾空格
break-spaces: 换行,保留换行符,不保留空格,制表符,保留行尾空格