CSS在布局的时候，会考虑到网页整体效果，会把超出某个DIV的文字自动省略，显示省略号，倘若不用CSS，那就需要用服务器端动态脚本来截取文字来实现了。杀鸡还是不要用牛刀，能在客户端实现的就不要交给服务器了。费话不多说了，本篇 CSS教程向你演示如何自动缩略超出的文字，变成省略号。先来看CSS定义部分的代码：
<style type="text/css">
.divout {
display: inline-block;
white-space: nowrap;
word-wrap: normal;
width: 100%;
overflow: hidden;
-ms-text-overflow: ellipsis;
-o-text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
text-overflow: ellipsis;
}
</style>HTML测试代码部分：
<div class="divout" style="width:100px;"> 懒之才为您提供精品的网页特效、网页教程，还有面向初学者的各类编程代码，助您早日成功编程高手。 </div>
运行结果如下：
懒之才...
这样就把超出部分的文字自动隐藏了，CSS并为其自动添加了“…”省略号，很实用吧？
