<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>
你好，看了 你的问题，单纯用css现在貌似解决不了，css只能实现溢出隐藏，用...来表示。你需要隐藏中间部分内容，需要用到js啊。可以用js先算出字符串的长度，然后截取收尾两段显示，中间加...即可。
overflow:hiddentext-overflow:ellipsis
white-space:nowrap
eg:<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title></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">
做自己的SEO 做自己的DIV+CSS 做自己的PHP
</div>
</body>
</html>
