<!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">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>CSS文字超出固定的字符数用省略号替代</title>
</head>
<style type="text/css">
/*<![CDATA[*/
body{
font-size:12px
line-height:22px
}
li {
width:200px
white-space:nowrap
text-overflow:ellipsis
-o-text-overflow:ellipsis
overflow: hidden
}
/*]]>*/
</style>
</head>
<body>
<ul>
<li><a href="#">天下獒是中国藏獒信息专业的门户网站,拥有丰富的藏獒新闻、藏獒交易、养獒知识、藏獒图片、藏獒视频和藏獒基地等信息,是养獒爱獒者 赏藏、买藏、卖藏、论獒最好的最全面的专业信息平台。</a></li>
<li><a href="#">天下獒是中国藏獒信息专业的门户网站,拥有丰富的藏獒新闻、藏獒交易、养獒知识、藏獒图片、藏獒视频和藏獒基地等信息,是养獒爱獒者 赏藏、买藏、卖藏、论獒最好的最全面的专业信息平台。</a></li>
<li><a href="#">文本溢出自动省略测试文本溢出自动省略测试</a></li>
<li><a href="#">天下獒是中国藏獒信息专业的门户网站,拥有丰富的藏獒新闻、藏獒交易、养獒知识、藏獒图片、藏獒视频和藏獒基地等信息,是养獒爱獒者 赏藏、买藏、卖藏、论獒最好的最全面的专业信息平台。</a></li>
<li><a href="#">文本溢出自动省略测试</a></li>
</ul>
</body>
</html>
css文件对页面影响不大,就算是你写3万行也没太大影响,一般主要影响页面的是图片、动态脚本、flash动画、后台程序;如果你工作不负责后台的话,那你就注意切图的时候尽量把图片处理的小一些,能1px平铺的就平铺,能用代码实现的就尽量别用图片,页面的动态效果尽量少一些,或者说没太大必要的就别弄,至于flash动画,能用gif代替就尽量别用swf文件;我一般写样式是不换行的,例如:
.divstyle{ color:#fffborder:1px solid redbackground:#000height:40px}
我习惯于这样写,这样能减少行数,一次能看到的样式数量会更多,比较方便于我修改;
很多人都习惯于下面这种写法,例如:
.divstyle{
color:#fff
border:1px solid red
background:#000
height:40px
}
这样的写法比较规整,看样式能够一目了然明白,只是行数太多了