CSS中,wrap通常指的是文字或圖片的自動換行。當一個盒子中放置了大量文字或是過長的圖片時,如果不進行限定,可能會導致頁面布局混亂,閱讀不便等問題。這時候就需要對該元素進行wrap限定,讓它自動換行。
.wrap { word-wrap: break-word; // 當單詞長度過長時,自動斷開并換行 overflow-wrap: break-word; // 當單詞或連續字符太長時,也自動斷開并換行 }
以上是一段簡單的wrap代碼,其中word-wrap可以讓單詞過長時自動換行,overflow-wrap則可以解決連續字符過長的問題。若需要對圖片進行wrap限定,可以使用以下代碼:
img { max-width: 100%; height: auto; }
以上的代碼可以將圖片寬度設為容器的最大寬度,同時保持高度自適應,使得圖片自動換行。