强制换行与强制不换行攻略

2020-05-07 06:01:31易采站长站整理

总结强制不换行:

强制不换行的问题到是比较容易分析的,就如上面所讨论的那样使用white-space:nowrap,Firefox的div和td中,以及IE的div中,均没有问题。唯一的瑕疵就是在IE的td中会有一个问题,如果td没有指定宽度,则nowrap仍然有效,如果td有宽度,并且文字中无标点、无空格(例如中文长串文字),nowrap则不再有效。解决方式就是可以加word-break:keep-all;可以解决此问题。综合下来,比较稳妥的方式是在文字与td之间再套一层div,然后使用nowrap,那么就是强制不换行。注意这时候很有可能文字会过多导致溢出容器,所以你还得加一个overflow:hidden,防止溢出容器,这样子就可以兼容各个浏览器了。

总结了那么多,发觉似乎也就那几个属性在浏览器里面的各种兼容性的平衡,现在似乎尚未有一个完美的方案可以全部兼容各个浏览器,我们所能做的最多的就是尽可能的保持个浏览器显示一致。如果你还是觉得一定要兼容所有的浏览器,那么最后的方案那么就是动用JS了,以后的文章中我会考虑从以最小的JS代价来满足此要求,但这暂不在本文所讨论的范围内。