溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了“word-wrap如何自動換行”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“word-wrap如何自動換行”這篇文章吧。
word-wrap介紹
word-wrap是設置對象內文字遇到對象頂邊時是否采取換行排版布局。
1、語法
word-wrap:normal——允許內容頂開指定的容器邊界，遇到連續沒有空格英文或沒有空格數字不換行（默認，不設置對象也具備默認樣式）
word-wrap:break-word——內容將在邊界內換行，當內容太多頂到對象邊界時，內容自動強制換行。
2、常見情況
對象內連續數字或字母太多后，內容頂邊對象容器后不會換行，而是溢出繼續不換行顯示。和漢字或有空格不同，漢字會定格容器邊界會自動換行。
3、使用語法
p{word-wrap:break-word}
設置html段落p內文字頂格對象容器邊緣自動換行。
代碼實例：
<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>css強制換行</title>
<style>
.bos{width:200px;height:80px;border:1pxsolid#F00;word-wrap:break-word;}
</style>
</head>
<body>
<pclass="bos">83480348023802ufjflsjfds843820483048jfdljfsl</p>
</body>
</html>
設置class=bos對象寬度，邊框，里面放入連續不斷文字和數字內容。如果不設置word-wrap:break-word可以瀏覽器中觀察連續數字內容不換行超出溢出盒子。
這里給予對象設置word-wrap:break-word強制換行樣式。
以前老IE瀏覽器比如IE6不支持，但現在大部分都是有谷歌瀏覽器，隨電腦系統升級都使用更高IE瀏覽器，或其它品牌瀏覽器，所以大部分都兼容此css自動換行屬性word-wrap樣式，大家可以放心使用。
以上是“word-wrap如何自動換行”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
