Code

<div id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>

#wrap { white-space : normal ;  width : 200px ;   }

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml" >

< head >

< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />

< title > 字符换行 </ title >

< style  type ="text/css" >

table,td,th,div  {  border : 1px green solid ; }

code  {  font-family : "Courier New", Courier, monospace ; }

</ style >

</ head >

< body >

< h1 >< code > div </ code ></ h1 >

< h1 >< code > All white-space:normal; </ code ></ h1 >

< div  style ="white-space:normal; width:200px;" > Wordwrap still occurs in a td element that has its WIDTH attribute set to a value smaller than the unwrapped content of the cell, even if the noWrap property is set to true. Therefore, the WIDTH attribute takes precedence over the noWrap property in this scenario </ div >

< h1 >< code > IE \ word-wrap : break-word ; </ code ></ h1 >

< div  style ="word-wrap : break-word ; width:200px;" > abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111 </ div >

< h1 >< code > IE \ word-break:break-all; </ code ></ h1 >

< div  style ="word-break:break-all;width:200px;" > abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111 </ div >

< h1 >< code > Firefox/ word-break:break-all; overflow:auto; </ code ></ h1 >

< div  style ="word-break:break-all; width:200px; overflow:auto;" > abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111 </ div >

< h1 >< code > table </ code ></ h1 >

< h1 >< code > table-layout:fixed; </ code ></ h1 >

< table  style ="table-layout:fixed"  width ="200" >

< tr >

< td > abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss </ td >

</ tr >

</ table >

< h1 >< code > table-layout:fixed; word-break : break-all; word-wrap : break-word ; </ code ></ h1 >

< table  width ="200"  style ="table-layout:fixed;" >

< tr >

< td  width ="25%"  style ="word-break : break-all; " > abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss </ td >

< td  style ="word-wrap : break-word ;" > abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss </ td >

</ tr >

</ table >

< h1 >< code > FF \ table-layout:fixed; overflow:hidden; </ code ></ h1 >

< table  style ="table-layout:fixed"  width ="200" >

< tr >

< td  width ="25%"  style ="word-break : break-all; overflow:hidden; " > abcdefghigklmnopqrstuvwxyz1234567890 </ td >

< td  width ="75%"  style ="word-wrap : break-word; overflow:hidden; " > abcdefghigklmnopqrstuvwxyz1234567890 </ td >

</ tr >

</ table >

</ body >

</ html >