CSS是網頁設計中必不可少的一部分,其中一個很重要的功能就是布局。而有時候我們需要對一個div進行限制,使其內部的元素可以自適應。
一個常見的做法就是給這個div設置一個最小寬度,代碼如下:
div { min-width: 100px; }
這樣就可以保證最小寬度為100px,但是如果內容過長超出了這個寬度,就會導致溢出。為了解決這個問題,我們可以設置自動換行,代碼如下:
div { min-width: 100px; word-wrap: break-word; }
這樣就可以保證內容超出最小寬度后自動換行,而不會溢出。但是這種方法有一個缺點,就是所有的地方都會自動換行,如果我們需要讓某些地方不換行怎么辦?
這時候我們可以使用white-space屬性,代碼如下:
div { min-width: 100px; word-wrap: break-word; white-space: pre-wrap; }
pre-wrap值可以保證在需要換行的地方換行,而在不需要換行的地方保持原有樣式。同時我們也可以使用其他的值,比如nowrap和pre-line,來滿足不同的需求。
上一篇css里面好看的自體
下一篇css阻止點擊穿透