CSS文本超出指定宽度后隐藏并显示为省略号的实现方法

一般的文字截断（适用于内联与块）：

1. .text-overflow {     
2.   
3.   display:block;      
4.   
5.   width:25em;     
6.   
7.   word-break:keep-all;      
8.   
9.   whitewhite-space:nowrap;     
10.   
11.   overflow:hidden;      
12.   
13.   text-overflow:ellipsis;  
14.   
15. }  

对于表格文字溢出的定义：

对于表格超出范围显示省略号

1. table{     
2.   
3.    width:25em;     
4.   
5.    table-layout:fixed;  
6.   
7. }   
8.   
9. td{   
10.   
11.   width:100%;     
12.   
13.   word-break:keep-all;      
14.   
15.   whitewhite-space:nowrap;       
16.   
17.   overflow:hidden;  
18.   
19.   text-overflow:ellipsis;  
20.   
21. }  

代码：

1.   
2. #div1{    
3.          padding: 10px;   
4.          width: 200px;   
5.          height:30px;   
6.          text-shadow: 3px 3px 3px #aaaaaa;   
7.          border: 1px solid #999999;   
8.          text-overflow: ellipsis;   
9.          overflow: hidden;   
10.          word-break: break-all;   
11.          white-space: nowrap;   
12.          }   
13.   
14.   
15.   
16.   
17.   
18.           AAAAAAAAAAAAABBBBBBBBBBBBBCCCCCCCCCCCCCCDDDDDDDDDDDD