文字別亂跑~，文字亂跑~

文字別亂跑~，文字亂跑~

　　為了讓網頁布局規整，我們經常要控制文欄位落的長度和高度。

　　當我們信心滿滿的為這些文字畫了一個DIV框子後，卻發現這些文字遠比我們想象中的調皮。

　　

 <div style="width:800px;height:50px;border:1px solid red;">
  調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的   文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。調皮的文字搗蛋的文字。
 </div>

運行結果如下：

 

這時我們在div中加入 overflow:hidden;讓跑出來的字隱藏掉,

看著還是別捏,再加一個 white-space:nowrap,:

還是不夠美觀,再來個 text-overflow:ellipsis,:

感覺好很多....

好了,讓大牛笑話了,其實我是來提問的:如何才能讓文字顯示三行,並且在最後一行的末尾用省略符號代替溢出的文字???

懇請賜教!