首頁  >  文章  >  web前端  >  Firefox CSS私有屬性備忘錄_經驗交流

Firefox CSS私有屬性備忘錄_經驗交流

WBOY
WBOY原創
2016-05-16 12:10:201239瀏覽

有時候..有些東西Firefox 總是支援不好....只能找私有屬性幫忙....
例子還米做...因為太多太不了解了. ..等理解得差不多時搞成本電子書.
雖然這些不推薦使用,可是萬不得以的時候總得有個解決的方法..

At-rules

@-moz-document url(http://www.w3.org/),<code>@-moz-document url(http://www.w3.org/),<br>url-prefix(http://www.w3.org/Style/),<br>domain(loaoao.com){<br>div{color:red;}<br>}url-prefix(http://www.w3.org/Style/ ),
domain(loaoao.com){
div{color:red;}
}

指定樣式在哪個網域下有用..如domain(loaoao.com) 可以在www.loaoao.com, lab.loaoao.com 下使用, 而如果是domain(www.loaoao.com) 的話.就只能在www.loaoao.com 使用


Pseudo-elements and pseudo-classes 偽類與偽物件

:-moz- 系列的還沒理解清楚.不知道是不是只應用在xul上的..

Properties 屬性
moz-appearance: appearance value
-moz-binding: uri | none ;
直接定義外觀 (測試無結果..)
-moz-background-clip: border | padding ;
連結XBL 跟HTC很像的東東..
-moz-background-inline-policy: bounding-box | continuous | each-box
背景是否包含 border, padding 不包含 ,對應CSS3 background-clip
內嵌背景渲染的方式 -moz-background-origin: border | padding | content 範例

-moz-border-top-colors:[color | transparent,]* color | transparent ;背景渲染的方式 根據 background-position 給邊或內容相反渲染. background-repeat:no-repeat 時無效 , -moz-border-right-colors,-moz-border-bottom-colors,-moz-left-right-colors對應CSS3 background-origin

-moz-border-radius: border-radius {1,4} | inherit 為border 定義多個顏色從外到裡..每個只有1px,最後一個填滿餘下的border,這個border-style 也會變成solid
沒預設.無繼承,可用於所有元素
-moz-box-align: start | center | end | baseline | stretch
定義圓角 可以單獨定義 -moz-border-radius-bottomleft, -moz-border-radius-bottomright, -moz-border-radius-topleft, -moz-border-radius-topright
-moz-box-direction: normal | reverse
定義內容的位置 ,只能用於 display 的值是 -moz-box 或是 -moz-inline-box 的元素
-moz-box-flex: number
定義內容的相反方向, 類別如direction, 只能用於 display 的值是 -moz-box 或是 -moz-inline-box 的元素
-moz-box-ordinal-group
還不明.測試無結果. 只能用於 display 的值是 -moz-box 或是 -moz-inline-box 的元素
-moz-box-orient: horizontal | vertical
官方未說明
-moz-box-pack: start | center | end | justify
還不明.測試無結果. 只能用於display的值是 -moz-box 或是 -moz-inline-box 的元素
-moz-box-sizing: content-box | border-box | padding-box
定義內容方向,(justify 無效),如類別 text-algin ,只能用於 display 的值是 -moz-box 或是 -moz-inline-box 的元素
-moz-image-region: rect(top, right, bottom, left);
border 與 padding 是不要計算就 width/height 裡面
-moz-key-equivalent
等整理...
-moz-opacity:number | inherit ;
官方未說明
-moz-outline: [-moz-outline-color || -moz-outline-style || -moz-outline-width | inherit ] ;
透明度...同CSS3的opacity 同時定義不疊加.

外的線條輪廓 同CSS3的outline 同時支援 -moz-outline-radius (圓角)

Values 屬性值cursor:-moz-alias | -moz-cell | -moz-context-menu | -moz-copy | -moz-grab | -moz-grabbing | -moz-spinning | -moz-zoom-in |-moz-zoom-out

cursor
定義滑鼠樣式..有些我測試跟官方的不一樣..我測試的在後面的小框裡面display: -moz-box | -moz-inline-block | -moz-inline-box | -moz-inline-grid | -moz-inline-stack | -moz-inline-table | -moz-grid | -moz-grid-group | -moz-grid-line | -moz-groupbox | -moz-deck | -moz-popup | -moz-stack | -moz-run-in | -moz-compact | -moz-marker
overflow: | -moz-scrollbars-horizontal | -moz-scrollbars-none | -moz-scrollbars-vertical | -moz-hidden-unscrollable
display的一些...對應說明等添加

overflow的一些...對應說明等添加
還有好多.....等了解了再添加...
資料來源: developer.mozilla .org/en/docs/CSS_Reference:Mozilla_Extensions
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn