查看“Css3 pr word wrap”的源代码

{{DISPLAYTITLE:word-wrap}}[[Category:css reference|201]]
= CSS3 word-wrap 属性 =

指定如果足够长得话，应该换行：

<sample title="" desc="" lang="html" hererun="1">

    p.test {word-wrap:break-word;}

 </sample>
<run name=""> <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小白教程(xiaobai.wang)</title>
<style>
p.test
{
    width:11em;
    border:1px solid #000000;
    word-wrap:break-word;
}
</style>
</head>
<body>

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

</body>
</html> </run>
== 浏览器支持 ==

表格中的数字表示支持该属性的第一个浏览器版本号。

{| class="table table-striped table-hover"
! 属性
! Chrome
! Internet Explorer / Edge
! Firefox
! Safari
! Opera
|-
| word-wrap
| 4.0
| 5.5
| 3.5
| 3.1
| 10.5
|}

== 属性定义及使用说明 ==

word-wrap属性允许长的内容可以自动换行。

{| class="table table-striped table-hover"
| 默认值：
| normal
|-
| 继承：
| yes
|-
| 版本：
| CSS3
|-
| JavaScript 语法：
| object.style.wordWrap=&quot;break-word&quot;
|}

== 语法 ==

<pre>
word-wrap: normal|break-word;</pre>
{| class="table table-striped table-hover"
! 值
! 描述
|-
| normal
| 只在允许的断字点换行（浏览器保持默认处理）。
|-
| break-word
| 在长单词或 URL 地址内部进行换行。
|}

== 相关文章 ==

CSS3 教程: [[css3 text effects|CSS3 Text Effects]]