DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> XML學習教程 >> XML詳解 >> firefox通過XUL實現text-overflow:ellipsis的效果
firefox通過XUL實現text-overflow:ellipsis的效果
編輯:XML詳解     

firefox不支持text-overflow一直讓人很折騰。。不過還好有大蝦為我們提供解決方案。。text-overflow: ellipsis for Firefox

  Firefox still does not implement the proposed CSS3 text-overflow property. It does however provide a similar behaviour for the XUL description element. Furthermore, it does support XBL bindings through CSS. This leads to the following solution:

.ellipsis {
 text-overflow: ellipsis;
 -moz-binding: url('ellipsis.XML#ellipsis');
<?XML version="1.0"?>
<bindings
 XMLns="http://www.mozilla.org/xbl"
 XMLns:xbl="http://www.mozilla.org/xbl"
 XMLns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
>
 <binding id="ellipsis">
  <content>
   <xul:description crop="end" xbl:inherits="value=xbl:text"><children/></xul:description>
  </content>
 </binding>
</bindings>

  xul:description的crop原來是那樣強。。除了可以點點點掉後面的。。還可以點點點前面或者中間部分的。。這個功能可是非常實用哦,不知道W3C蝦米時候也給這樣的CSS屬性讓我們簡單搞定一大堆問題呢。

  然後還不小心發現。hedger悄悄的也實現一樣的功能Hacking text-overflow for Firefox,不過還是感覺用XBL簡潔方便。。

  在很久很久以前,我也在研究,能不能調用Firefox處理title的點點點的東東來完成效果,不過一直沒實現。之前提出的-moz-text-overflow: ellipsis;via這種不靠譜的說法也不行,看來人家是鐵了心。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved