word-wrap属性允许长的内容可以自动换行。
注意:针对这个属性,“字” 定义为由空白符包围的一个字符串。如果指定为长度值,会调整字之间的通常间隔;所以,normal 就等同于设置为 0。允许指定负长度值,这会让字之间挤得更紧。
word-wrap: normal|break-word;
值 | 描述 |
normal | 只在允许的断字点换行(浏览器保持默认处理)。 |
break-word | 在长单词或 URL 地址内部进行换行。 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>NTHOME-零基础入门学习Web(HTML5+CSS3)</title>
<style>
p{
width:222px;
border:1px solid #000000;
}
.test
{
word-wrap:break-word;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab amet culpa debitis dolorem, doloremque doloribus dolorum ea eligendi eveniet, fugit hic incidunt maxime minima modi quia quis sapiente soluta velit.</p>
<p class="test">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus autem, consectetur deleniti doloremque ea error eveniet excepturi maiores minus natus nemo officiis recusandae, sit sunt vel! Adipisci consequuntur enim ratione?</p>
</body>
</html>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab amet culpa debitis dolorem, doloremque doloribus dolorum ea eligendi eveniet, fugit hic incidunt maxime minima modi quia quis sapiente soluta velit.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus autem, consectetur deleniti doloremque ea error eveniet excepturi maiores minus natus nemo officiis recusandae, sit sunt vel! Adipisci consequuntur enim ratione?
表格中的数字表示支持该属性的第一个浏览器版本号。
Safari | Chrome | FireFox | IE |
1.0 | 1.0 | 1.0 | 4.0 |