Style wordWrap 属性
允许长单词换行到下一行:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>蜜蜂教程(mifengjc.com)</title>
<style>
#myDIV {
width: 150px;
height: 100px;
background-color: lightblue;
border: 1px solid black;
}
</style>
</head>
<body>
<p>点击“尝试一下”按钮。让 DIV 元素中的长单词换行到下一行:</p>
<div id="myDIV">Thiscouldbeaninsainlylargeword</div>
<button onclick="myFunction()">尝试一下</button>
<script>
function myFunction() {
document.getElementById("myDIV").style.wordWrap = "break-word";
}
</script>
</body>
</html>
定义和用法
wordWrap 属性允许长单词或 URL 地址换行到下一行。
浏览器支持
![]()
![]()
![]()
![]()
![]()
所有主流浏览器都支持 wordWrap 属性。
语法
返回 wordWrap 属性:
object.style.wordWrap
设置 wordWrap 属性:
object.style.wordWrap = "normal|break-word|initial|inherit"
属性值
| 值 | 描述 |
|---|---|
| normal | 只在允许的断字点换行(浏览器保持默认处理)。 |
| break-word | 在长单词或 URL 地址内部进行换行。 |
| initial | 设置该属性为它的默认值。请参阅 initial。 |
| inherit | 从父元素继承该属性。请参阅 inherit。 |
技术细节
| 默认值: | normal |
|---|---|
| 返回值: | 字符串,表示元素的 word-wrap 属性。 |
| CSS 版本 | CSS3 |
相关文章
CSS 参考手册:word-wrap 属性
Style 对象
Style 对象