CSS使文本溢出邊界顯示爲省略號(2)

1. 使文本溢出邊界顯示爲省略號

#xx{width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
首先需設置將文本強制在一行內顯示，然後將溢出的文本通過overflow:hidden截斷，並以text-overflow:ellipsis方式將截斷的文本顯示爲省略號。

2.

使文本溢出邊界不換行強制在一行內顯示

     #xx{width:150px;white-space:nowrap;}

3.

使連續的長字符串自動換行

#xx{width:150px;word-wrap:break-word;}

1. 做1像素細邊框的table

2. #test{border-collapse:collapse;border:1px solid #ddd;}
   #test th,#test td{border:1px solid #ddd;}
   
   <table id="test">
   	<tr><th>姓名</th><td>Joy Du</td></tr>
   	<tr><th>年齡</th><td>26</td></tr>
   </table>

方法二

1. #test{border-spacing:1px;background:#ddd;}
   #test tr{background:#fff;}
   
   <table id="test" cellspacing="1">
   	<tr><th>姓名</th><td>Joy Du</td></tr>
   	<tr><th>年齡</th><td>26</td></tr>
   </table>