属性定义及使用说明
word-break属性指定非CJK脚本的断行规则。
提示:CJK脚本是中国，日本和韩国（”中日韩”）脚本。
| 默认值： | normal |
|---|---|
| 继承： | yes |
| 版本： | CSS3 |
| JavaScript 语法： | object.style.wordBreak=”break-all” |
语法
word-break: normal|break-all|keep-all;
| 值 | 描述 |
|---|---|
| normal | 使用浏览器默认的换行规则。 |
| break-all | 允许在单词内换行。 |
| keep-all | 只能在半角空格或连字符处换行。 |
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
| 属性 | 谷歌 | IE | 火狐 | 苹果 | opera |
|---|---|---|---|---|---|
| word-break | 4.0 | 5.5 | 15.0 | 3.1 | 15.0 |
实例
在合适的点换行：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Web176教程网(web176.com)</title>
<style>
p.test1
{
width:9em;
border:1px solid #000000;
word-break:keep-all;
}
p.test2
{
width:9em;
border:1px solid #000000;
word-break:break-all;
}
</style>
</head>
<body>
<p class="test1"> This paragraph contains some text. This line will-break-at-hyphenates.</p>
<p class="test2"> This paragraph contains some text: The lines will break at any character.</p>
<p><b>注意:</b> word-break 属性不兼容 Opera.</p>
</body>
</html>作者：terry，如若转载，请注明出处：https://www.web176.com/css3textpro/5142.html
支付宝 
微信 