昨天在做一個JavaScript練習的時候，我要將一段文字插入到div裡，在這個過程中偶然接觸到了一個以前不知道的屬性——“fit-content”
在實踐中也許會遇到這麼一種情況，我們給一個固定寬度的div裡面輸入一廠串連續的英文字母，如果輸入的足夠多，文字會溢位來，就像這樣：

只有當輸入的是英文的時候才會出現這種情況，因為一長串的英文字母會被預設為是一個單詞，而漢字則不會有這個問題。
一般情況下解決這類問題我會新增換行斷點的屬性，比如：word-wrap或者word-break。
而fit-content屬性可以把內容包裹起來
設定：width:-moz-fit-content;(我用的火狐瀏覽器)
效果：

但fit-content也有一個小問題：如果一個元素的width已經設定過，再設定width：fit-content；會衝突。最終div的寬度以div內子元素的寬為準，換句話說也就是“向內自適應”。比如咱們建立一個div，在這個div裡面放一個100*100的圖片，給div的寬度設定為width：200px; 然後再寫width：fit-content；雖然還是會居中，但實際這個div的寬還是100。
還有一個問題就是目前這個屬性的相容性不是特別的好，用的時候要加上字首。
除了fit-content以外，還知道了max-content，mini-content，fill-avaliable屬性，還有Intrinsic Sizing（內部尺寸）和Extrinsic Sizing（外部尺寸）特性。這些納入今後的學習目標，等多做些瞭解再來總結。