通过css将溢出内容用省略号表示

在我们平常网站设计中，在网站首页中经常显示文章标题或者内容的时候，为了版面的好看无需要将全部内容展示在网站首页里面，毕竟首页版面是有限的，因此我们多数时候会以省略号的形式来表示内容未显示完。为了方便设计我们除了在程序中控制字符，还可以通过css来设计。
例如：“蔚蓝格调将在2014年扩大公司规模以此应对不断增长的业务”，如果我们在网站首页中显示总价内容其他用省略号表示通过css制作方式如下：
<div class="showtit"><p>蔚蓝格调将在2014年扩大公司规模以此应对不断增长的业务</p></div>

.showtit{
 width:100px;height:30px;
 }

/* IE下的样式 */
.showtit p{
 display: block;
 width:100px;/*对宽度的定义,根据情况修改*/
overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
 }

/* FF 下的样式 */
.showtit{clear:both;}
.showtit p{
 float:left;
 max-width:175px;   /*IE不能解释该属性，而FF可以*/
 }
.showtit p:after{
 content:"...";
 }

当然除了css中可以实现,通过jquery实现也是一样的。