使用CSS不用程序实现文字自动截断用省略号代替


答案：.test{  
width:200px;  
height:50px;  
border:1px solid red;  
padding:10px;  
overflow:hidden; /*不显示超过对象宽度的内容*/  
text-overflow:ellipsis; /*当对象内文本溢出时显示省略标记（...）*/  
white-space:nowrap; /*限制在一行内显示所有文本*/  
}  

<html>   
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
<title>www.zzzyk.com 脚本之家</title>   
</head>   
<style type="text/css">   
div.test{   
width:200px;   
height:100px;   
border:1px solid red;   
padding:10px;   
overflow:hidden;   
text-overflow:ellipsis;   
white-space:nowrap;   
}   

</style>   

<body>   
<div class="test">   
脚本之家，努力打造精品学习网站。欢迎大家光临</div>   
</body>   
</html> 

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

上一个：用javascript来控制链接的target 属性的代码
下一个：对于IE7、FF、OP清除浮动的最优方法第1/2页

更多图片编程知识:

使用CSS不用程序实现文字自动截断 用省略号代替

使用CSS不用程序实现文字自动截断用省略号代替