CSS文本溢出自动省略 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head>
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>CSS文本溢出自动省略</title>
<style type="text/css">
body{
font-size:12px;
line-height:22px;
}
li {
    width:180px;
    white-space:nowrap;/*空白文字不换行*/
    text-overflow:ellipsis; 
    -o-text-overflow:ellipsis;/*针对Opera*/
    overflow: hidden;/*溢出隐藏*/
    }
</style>
</head>
<body>
    <ul>
<li><a href="/jscss/code/124.shtml" target="_blank">左右切换鼠标可控的无缝图片滚动代码</a></li>
<li><a href="/jscss/code/111.shtml" target="_blank">一款经典简洁的CSS滑动门代码</a></li>
<li><a href="/jscss/code/194.shtml" target="_blank">QQ在线客服JS代码，自适应漂浮在网页右侧</a></li>
<li><a href="/jscss/code/47.shtml" target="_blank">竖向折叠的CSS滑动菜单</a></li>
<li><a href="/jscss/code/255.shtml" target="_blank">JS图片滚动代码（无缝、平滑）</a></li>
<li><a href="/jscss/code/127.shtml" target="_blank">仿淘宝阴影效果的滑动门选项卡</a></li>
<li><a href="/jscss/code/24.shtml" target="_blank">带倒影的图片切换效果（类似FLASH）</a></li>
    </ul>
</body>
</html>

 

posted on 2013-03-11 21:40  .NET每天一小步  阅读(128)  评论(0)    收藏  举报