<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#box{
width: 200px;
background-color: blue;
/强制换行 当前行放不下这个单词 则整个单词换下一行显示。如果下一行还放不下，则将单词拆分显示/
word-wrap: break-word;
/*break-all 允许在单词内换行 */
/*keep-all 支持不好 safari 和 chrome 不支持*/
/* 直接在本行显示 不会整个单词换行 如果显示不下 则将单词拆分显示 */
word-break: break-all;
}
</style>
</head>
<body>
<div id="box">
我的高中是在家乡的小镇上读的，校门口就是216省道，沿着省道走10几分钟有一座大桥，桥下面就是“香河”，河流是汉江的分支，水势汹涌，河流湍急。
</div>
</body>
</html>
网友评论