超出宽度的文字自动加省略号…的css很简单,但是如果在button上使用这个要注意了,在chrome26及以下不支持,升级到27后可以

.overflow {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width:50px;
  display:inline-block;
}
<button class="overflow">测试文字测试文字</button>
<div class="overflow">测试文字测试文字</div>

在线测试:
http://jsfiddle.net/jonwang/Qhaqw/