文字超出了需要隱藏並顯示省略號這個在工作中很多時候都要用到，我想很多人都碰到過吧，這個有兩種解決方法

一是用程式開擷取字元長度，這個其實也是可以的

第二種是用樣式來做,這裡主要介紹一下用樣式怎麼來做吧，我話也不多說了吧直接上程式碼吧，

css樣式如下：

[css]

.css1{

color:#6699ff;border:1px #ff8000 dashed;

margin-bottom:20px;

width: 20em;/*不允許出現半漢字截斷*/

}

.css2 {

overflow: hidden; /*自動隱藏文字*/

text-overflow: ellipsis;/*文字隱藏後新增省略號*/

white-space: nowrap;/*強制不換行*/

width: 20em;/*不允許出現半漢字截斷*/

color:#6699ff;border:1px #ff8000 dashed;

}

[/css]

html程式碼如下：

[html]

<div>Web前端開發 – 專注於網站前端設計與Web使用者體驗</div>

<div>Web前端開發 – 專注於網站前端設計與Web使用者體驗</div>

[/html]

<st這yle type=”text/css”>

.css1{

color:#6699ff;border:1px #ff8000 dashed;

margin-bottom:20px;

width: 20em;/*不允許出現半漢字截斷*/

}

.css2 {

overflow: hidden; /*自動隱藏文字*/

text-overflow: ellipsis;/*文字隱藏後新增省略號*/

white-space: nowrap;/*強制不換行*/

width: 20em;/*不允許出現半漢字截斷*/

color:#6699ff;border:1px #ff8000 dashed;

}

</style>

<div class=”css1″>Web前端開發 – 專注於網站前端設計與Web使用者體驗</div>

<div class=”css2″>Web前端開發 – 專注於網站前端設計與Web使用者體驗</div>

<p>