CSS自动换行、强制不换行、强制断行、超出显示省略号

  项目在测试过程中，偶尔会被美女测试同事提出bug，“哪里哪里功能文字不换行，布局乱啦，好丑！”。跑过去一看原来是输入了大量的英文和数字导致不换行。虽然现实情况不会有这种需求输入一大堆数字和字母，但还是测出来了，改改终究还是好的。

强制不换行

div { 
    white-space:nowrap; 
}

自动换行

div{ 
    word-wrap: break-word; 
    word-break: normal; 
}

强制英文单词断行

div{ 
    word-break:break-all; 
}

超出省略号

div{ 
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}