小熊泡泡

          常用鏈接

          統計

          最新評論

          text-overflow 全兼容 (轉載)

          text-overflow 這個CSS屬性用于設置或檢索是否使用一個省略標記(...)標示對象內文本的溢出。比起在后臺用程序截斷文本再附上省略標記的做法,用CSS來處理文本溢出顯然更溫和(unobtrusive)一些。所以它已經被定義在 >>CSS 3 規范中,但目前為止,還只有 IE6+ 提供了對其的支持(>>據說 Safari 1.3+ 已經支持)。

          幸好,Opera 和 Firefox 都有相應的hack方法。

          Opera 提供了一個 -o-text-overflow:ellipsis 來模擬CSS3中的 text-overflow:ellipsis,郭爽的Blog里有一個>>demo

          而Firefox,有人貢獻了一個Firefox獨有的XBL技術實現 -- >>Simulating text-overflow on Firefox with unobtrusive Javascript, 博客的作者勸大家不要再花精力去尋找其他針對Firefox的解決辦法了,因為他已經花費了大量的時間都無法找到一個滿意的方案。從>>demo 源碼中可以看到如下的CSS屬性定義

          text-overflow:ellipsis;
          -moz-binding:url("moz-text-overflow.xml#XBLDocument");

          從代碼中看出,這個解決方案還需要一個 xml 格式的XBL組件定義文件以及配套的一個 js 文件,其實我想也可以通過直接編寫js 來實現相同的效果,不過不如標題中所說的那么 unobtrusive 而已。

          最后,一個兼容主流瀏覽器的 text-overflow CSS 定義可能如下:

          .textOverflow {
              overflow: hidden;
              text-overflow: ellipsis;
              -o-text-overflow: ellipsis;
              -moz-binding: url("moz-text-overflow.xml#XBLDocument");/*配套對應的xml和js文件*/
          }

          posted on 2006-07-08 22:39 小熊泡泡 閱讀(303) 評論(1)  編輯  收藏 所屬分類: html-css

          評論

          # re: text-overflow 全兼容 (轉載) 2013-05-07 13:49 薩提亞

          原來是這樣的  回復  更多評論   

          主站蜘蛛池模板: 华亭县| 上虞市| 乌恰县| 历史| 古丈县| 汝阳县| 两当县| 汽车| 邹城市| 刚察县| 大厂| 泗水县| 新余市| 安陆市| 江阴市| 新巴尔虎右旗| 抚宁县| 房产| 伊宁市| 宁远县| 乌拉特中旗| 东明县| 和龙市| 修文县| 舟曲县| 黄石市| 肃北| 阳西县| 汾阳市| 康定县| 乌兰察布市| 聂拉木县| 广水市| 当雄县| 潞城市| 海盐县| 双峰县| 汝城县| 渝北区| 崇州市| 阳西县|