大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 css如何將他們換行的方法!
對於div
1.(ie瀏覽器)white-space:normal; word-break:break-all;這裡前者是遵循標準。
#wrap
或者#wrap
eg.ddd1111111111111111111111111111111111
效果:可以實現換行
2.(firefox瀏覽器)white-space:normal; word-break:break-all;overflow:hidden;同樣的ff下也沒有很好的實現方法,只能隱藏或者加滾動條,當然不加滾動條效果更好!
#wrap
或者#wrap
eg.ddd1111111111111111111111111111111111111111
效果:容器正常,內容隱藏
新建乙個前端學習qun438905713,在群裡大多數都是零基礎學習者,大家相互幫助,相互解答,並且還準備很多學習資料,歡迎零基礎的小夥伴來一起交流。
對於table
1. (ie瀏覽器)使用樣式table-layout:fixed;
eg.
abcdefghigklmnopqrstuvwxyz 1234567890
效果:可以換行
2.(ie瀏覽器)使用樣式table-layout:fixed與nowrap
eg.
abcdefghigklmnopqrstuvwxyz 1234567890
效果:可以換行
3. (ie瀏覽器)在使用百分比固定td大小情況下使用樣式table-layout:fixed與nowrap
abcdefghigklmnopqrstuvwxyz 1234567890
abcdefghigklmnopqrstuvwxyz 1234567890
效果:兩個td均正常換行
3.(firefox瀏覽器)在使用百分比固定td大小情況下使用樣式table-layout:fixed與nowrap,並且使用div
eg.
abcdefghigklmnopqrstuvwxyz 1234567890
abcdefghigklmnopqrstuvwxyz 1234567890
這裡單元格寬度一定要用百分比定義
效果:正常顯示,但不能換行(注:在ff下還沒有能使容器內容換行的好方法,只能用overflow將多出的內容隱藏,以免影響整體效果)
CSS網頁製作時實現自動換行的小技巧
大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 css如何將他們換行的方法!對於div 1.ie瀏覽器 white space normal word break break all 這裡前者是遵循標準。wrap 或者 wrap eg.ddd11111111111111...
CSS網頁製作時實現自動換行的小技巧
大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 css如何將他們換行的方法!對於div 1.ie瀏覽器 white space normal word break break all 這裡前者是遵循標準。wrap 或者 wrap div id wrap ddd11111...
CSS網頁製作時實現自動換行的小技巧
大家都知道連續的英文或數字能是容器被撐大,不能根據容器的大小自動換行,下面是 css如何將他們換行的方法!對於div 1.ie瀏覽器 white space normal word break break all 這裡前者是遵循標準。wrap 或者 wrap div id wrap ddd11111...