在CSS3中，我們可以使用word-wrap屬性來設置“長單詞”或“URL地址”是否換行到下一行。
語法：
word-wrap:取值;
說明：
word-wrap屬性只有2個取值：normal和break-word。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS3 word-wrap屬性</title>
<style type="text/css">
#lvye
{
width:200px;
height:120px;
border:1px solid gray;
}
</style>
</head>
<body>
<div id="lvye">Welcome,everyone!Please remenber our home page website is http://www.lvyestudy.com/index.aspx</div>
</body>
</html>
在浏覽器預覽效果如下：
分析：
默認情況下，文本是自動換行的，但是如果單詞或者URL地址太長的話，就會超出區域范圍。
在上面例子中，當我們為div加上“word-wrap:break-word;”屬性時（大家自行添加測試），在浏覽器預覽效果如下：
word-wrap屬性允許你設置文本強制換行，這樣意味著會對“長單詞”或“URL地址”進行拆分換行。
word-wrap屬性在我們偉大的天朝很少用，因為這個屬性是針對英文來說的，中文中沒有什麼所謂的“長單詞”之說。一般情況下，在中文網站開發中，word-wrap屬性只要采用默認值即可。當然，如果你開發的是英文網站，就很有可能用到word-wrap這個屬性了，學習一下也無妨。