CSS截取字符串,多余文字省略号显示

body{font-family:Arial, Helvetica, sans-serif; /* 字体种类*/font-size:12px;/*字体大小*/}div{width:200px; /*容器宽度*/height:24px;/

lifaming15

1856人浏览 · 2011-09-14 22:24:55

lifaming15 · 2011-09-14 22:24:55 发布

<style type="text/css">
body{
    font-family:Arial, Helvetica, sans-serif; /* 字体种类*/
    font-size:12px;/*字体大小*/
}
div{
    width:200px; /*容器宽度*/
    height:24px;/*高度*/
    line-height:24px;/*行高*/
    overflow:hidden;/*超出部分 隐藏*/
    border:#ccc solid 1px;/*容器边框,1像素,颜色是#ccc(淡灰)*/
    background-color:#F9F9F9;/*背景色*/
    margin:5px;/*上下左右全空5像素*/
}
div a{
    color:#000;/*链接颜色*/
    display:block;/*转化为区块*/
    padding-right:7px;/*右缩进7像素*/
    background:url(http://www.365css.cn/example/ellipsis_365css.cn/ellipsis.gif) no-repeat right bottom; /*背景图片,右下显示,只显示一次*/
}
</style>

<div><a href="#">CSS截取字符串，超出用省略号代替</a></div>
<div><a href="#">CSS截取字符串，并将超出用省略号代替</a></div>
<div><a href="http://www.hi.baidu.com/fzlibei" target="_blank">CSS</a></div>
<div><a href="http://www.hi.baidu.com/fzlibei" target="_blank"><span></span></a></div>