控制换行or不换行

强制不换行 
div{ 
white-space:nowrap; 
} 

自动换行 
div{ 
word-wrap: break-word; 
word-break: normal; 
} 

强制英文单词断行 

div{ 
word-break:break-all; 
} 

 

=================================

 

word-wrap同word-break的区别

 

word-wrap是控制换行的。

break-word 是控制是否断词的。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。

　　normal是默认情况，英文单词不被拆开。

　　break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。

　　keep-all，是指Chinese, Japanese, and Korean不断词。即只用此时，不用word-wrap，中文就不会换行了。（英文语句正常）

 

 

=================================

table td 控制不换行，多余的部门隐藏已省略号形式出现（注意 td一定要指定width，否则无效）

<style type="text/css">
	table {
		table-layout:fixed;
	}
	td{
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
	}
</style>

 

{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:100px;}／/*不换行，超出部分隐藏且以省略号形式出现*/