CCS3屬性之text-overflow:ellipsis;的用法和注意之處

語法：

text-overflow：clip | ellipsis

默認值：clip

適用於：所有元素

clip： 當對象內文本溢出時不顯示省略標記（...），而是將溢出的部分裁切掉。
ellipsis： 當對象內文本溢出時顯示省略標記（...）。

在使用的時候，有時候發現不會出現省略標記效果，經過測試發現，使用ellipsis的時候，必須配合overflow:hidden; white-space:nowrap; width:50%;這三個樣式共同使用才會有效果，示例代碼：

<style type="text/css">
    .test{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:150px;}
</style>

<div class="test">關於**產品的推廣關於**產品的推廣關於**產品的推廣</div>

上面的width屬性根據實際需要填寫，其它樣式是固定的。

 

 

轉載請注明：http://www.tea119.com