`
pengfeifei26
  • 浏览: 232264 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

css 控制字数，多出用...表示

    博客分类：
  • java
 
阅读更多
<html>
    <head>
       <title></title>
       <style type="text/css">
           #newsList{ font-size:14px;}
           #newsList ul,#newsList ul li{ list-style:none}
           #newsList ul{width:380px;}
           #newsList ul li{ width:300px; margin-bottom:5px; height:16px;}
           #newsList ul li span{display:block; float:right;}
           #newsList ul li a {
               text-decoration:none;
               display:block;
               float:left;
               width:175px;
               overflow:hidden;          /*超出部分隐藏*/
               white-space:nowrap;
               /*文本溢出用"..."表示*/
               text-overflow:ellipsis;                    /*适用IE*/
               -o-text-overflow:ellipsis;                 /*适用opera*/
               -moz-binding: url('ellipsis.xml#ellipsis');/*适用火狐(firefox通过XUL实现效果)*/
           }
      </style>
   </head>
   <body>
      <div id="newsList">
          <ul>
              <li><a href="#" >使用Css隐藏超出容器宽度的文字</a><span>[2010-12-01]</span></li>
              <li><a href="#">使用Css隐藏超出容器宽度的文字</a><span>[2010-12-01]</span></li>
              <li><a href="#">使用Css隐藏超出容器宽度的文字</a><span>[2010-12-01]</span></li>
          </ul>
      </div>
  </body>
  </html>
分享到：
| com/caucho/server/http/ResinServer
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics