html ul li 和 div超出现实省略号....

在html 页面里 内容超出 宽度 用省略号现实... 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>无标题 1</title>
<style type="text/css">
    ul{
     list-style:none;
    }
    .list_block_300 {
    padding: 13px 5px 10px;
    padding: 10px 5px 10px    9;
    width: 295px;
    }

    .list_block_300 li {
    padding: 5px 5px 5px 11px;
    padding: 7px 5px 6px 11px    9;
    width: 279px;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    
    }
    .divhidden{
    width: 279px;white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    
    }
</style>
</head>
<body>
<div>
     <ul class="list_block_300">                                       
                <li><a title="福州学习中心“惠安建筑人才学历班”(131批次)开学典礼" target="_blank" style="  " href="#">福州学习中心“惠安建筑人才学历班”(131批次)开学典礼</a></li>                       
                <li><a title="严格管理,热情服务——汉中学习中心131批次开学典礼主题" target="_blank" style="  " href="#">严格管理,热情服务——汉中学习中心131批次开学典礼主题</a></li>                       
                <li><a title="新起点,新篇章:北京学习中心2013年春季毕业典礼" target="_blank" style="  " href="#">新起点,新篇章:北京学习中心2013年春季毕业典礼</a></li>                       
                <li><a title="因地制宜,方便学生:普洱现代学习中心131批次开学活动" target="_blank" style="  " href="#">因地制宜,方便学生:普洱现代学习中心131批次开学活动</a></li>                       
                <li><a title="温州学习中心131批次新生开学典礼" target="_blank" style="  color:red;" href="#">温州学习中心131批次新生开学典礼</a></li>                       
     </ul>
 </div>
 <div class="divhidden">严格管理,热情服务——汉中学习中心131批次开学典礼主题 </div>
</body>

</html>
View Code

 效果:

政和论坛



作者:JasonXuVip
我的网址:政和生活网
本文地址:
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利.

原文地址:https://www.cnblogs.com/jasonxuvip/p/3101264.html