css控制不溢出,不换行,溢出部分省略号显示：white-space:nowrap;text-overflow:ellipsis;overflow:hidden;

一、text-overflow省略号样式语法结构  

text-overflow语法：
text-overflow : clip | ellipsis

text-overflow参数值和解释：
clip : 　不显示省略标记（...），而是简单的裁切
ellipsis : 　当对象内文本溢出时显示省略标记（...）

二、text-overflow应用案例   

三、Overflow可以实现隐藏超出对象内容，同时也有显示与隐藏滚动条的作用

2、案例描述
      我们假设3个标题的li列表布局，对li对象设置一定宽度和高度，对前两个li列表内容放过多测试文字，第三个li列表放入可显示完测试文字。因为我们要避免内容过多撑破对象，所以我们对li再设一个overflow:hidden css样式，用于css隐藏超出内容，避免内容过多溢出li对象。

1. <style type="text/css"> 
2. *{ 
3.  padding:0;
4.  margin:0
5. } 
6. a{ text-decoration:none;
7. color:#6699ff
8. } 
10. ul,li{ 
11. list-style:none;
12.  text-align:left
13. } 
14.  
15. #divcss5{
16. border:1px #ff8000 solid; 
17. padding:10px; width:150px; 
18. margin-left:10px; 
19. margin-top:10px
20. } 
21. #divcss5 li{
22. width:150px;
23. height:24px;
24. line-height:24px;
25.  font-size:12px; 
26. color:#6699ff;
27. overflow:hidden;
28. text-overflow:ellipsis; 
29. border-bottom:1px #ff8000 dashed;
30. } 
31. #divcss5 li a:hover{ 
32. color:#333
33. } 
35. style> 
36. head> 
37. <body> 
38. <ul id="divcss5"> 
39. <li><a href="#"><nobr>• 显示不完显示省略号，测试内容nobr>a>li> 
40. <li><a href="#"><nobr>• 第二排测试内容超出显示省nobr>a>li> 
41. <li><a href="#"><nobr>• 能显示完几个字nobr>a>li> 
42. ul> 
43. body> 
44. html>