今晚在制作主题时，无意中发现个问题：用长串的英文时，尽然不会自动换行且不会撑破页面，而中文确不会发生这类状况。本以为是wordpress存在的bug！后来发现原来CSS中的word-wrap或word-break样式（很少很少用到）是可以避免此类问题发生的，但是两者有区别和与浏览器兼容的问题！
总结下：
用word-wrap控制换行，如：word-wrap:break-word
使用break-word时，是将强制换行。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。break-word是控制是否断词的。normal是默认情况，英文单词不被拆开。
使用break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。keep-all，是指Chinese, Japanese, and Korean不断词。即只用此时，不用word-wrap，中文就不会换行了。（英文语句正常。）
IE下：
使用word-wrap:break-word;所有的都正常。
FireFox下：
如这2个都不用的话，中文不会出任何问题。英文语句也不会出问题。但是，长串英文会出问题。
为了解决长串英文，一般用word-wrap:break-word;word-break:break-all;。但是，此方式会导致，普通的英文语句中的单词会被断开（IE下也是）。
目前主要的问题存在于 长串英文 和 英文单词被断开。其实长串英文就是一个比较长的单词而已。即英文单词应不应该被断开？那问题就很明显，显然不应该被断开了。对于长串英文，就是恶意的东西，自然不用去管了。但是，也要想些办法，因为它可能会把容器撑大。
那么就用：overflow:auto; IE下，长串会自动折行。FireFox下，长串会被遮盖。
所以，综上，最好的方式是word-wrap:break-word;overflow:hidden; 让文章换行！
也可以用（测试没问题）：
#single
{
table-layout: fixed;
word-wrap:break-word;
word-break:break-all;
}
转载本站文章请注明，转载自：我心疯狂[http://blog.crazyfrom.com] 本文链接: http://blog.crazyfrom.com/css.html
看了一下，我心也没怎么更新哦。哈哈。
虾´s last blog ..虎年前几小时回顾。。
[回复]
SoSo0_0 回复:
二月 16th, 2010 at 19:28
@虾,
哎哟，那就很失败了！
[回复]
http://www.crazyfrom.com/ 你這個网站的留言框怎么移植的！？我也想移植，但是我没成功！希望能提供一下帮助！我最近也在做cms主题！谢谢！QQ：303602897 kay@llpop.com
[回复]
很不错，学习一下！
[回复]
不错。学习学习~
超人´s last blog ..小年!你们的小年是哪一天?
[回复]
技术性的东西呢，不错呐，领教了
[回复]
很多都是这个浏览器支持，那个浏览器不支持的~
很麻烦哪~ 这东西~
[回复]
学习了。。
海派´s last blog ..冒险喜剧科幻大片《失落的大陆》(视频)
[回复]
我怎么记得看过此文？
个性签名：别点我的名字，它只是个传说。www.thatwrong.com到此一游。
[回复]
晕菜，每次来信息都要重新填写。。
[回复]
技术性的东东学习一下。。
[回复]
学习了嘿嘿。。
[回复]
这个BUG都被你发现了，厉害。
[回复]
SoSo0_0 回复:
一月 24th, 2010 at 17:10
@竹, 其实也不是什么bug，是我太out了！
[回复]
不错哦~~学习了
[回复]