-moz-image-region
非標準: この機能は標準ではなく、標準化の予定もありません。公開されているウェブサイトには使用しないでください。ユーザーによっては使用できないことがあります。実装ごとに大きな差があることもあり、将来は振る舞いが変わるかもしれません。
list-style-image
プロパティの画像を使用している特定の XUL 要素や擬似要素では、このプロパティは画像全体の代わりに使用される画像の領域を指定します。これにより、要素は同じ画像の異なる部分を使用してパフォーマンスを向上させることができます。
css
/* キーワード値 */
-moz-image-region: auto;
/* <shape> 値 */
-moz-image-region: rect(0, 8px, 4px, 4px);
/* グローバル値 */
-moz-image-region: inherit;
-moz-image-region: initial;
-moz-image-region: unset;
構文は clip
プロパティと似ています。4 つの値はすべて、画像の左上隅を基準にしています。
メモ:
背景画像で動作する仕組みについては、 -moz-image-rect()
を参照してください。
構文
値
公式定義
初期値 | auto |
---|---|
適用対象 | XUL の 要素と :-moz-tree-image , :-moz-tree-twisty , :-moz-tree-checkbox の各擬似要素。 注: -moz-image-region はアイコンが list-style-image を使用して指定された 要素でしか機能しません。 XUL の <image src="url" /> では機能しません。 |
継承 | あり |
計算値 | 指定通り |
アニメーションの種類 | 離散値 |
形式文法
Error: could not find syntax for this item
例
画像の切り抜き
css
#example-button {
/* この画像の左上から 4x4 の領域のみを表示する */
list-style-image: url("chrome://example/skin/example.png");
-moz-image-region: rect(0px, 4px, 4px, 0px);
}
#example-button:hover {
/* 最初のボタンの右にある 4x4 の領域を、ホバーされたボタンに使用します。 */
-moz-image-region: rect(0px, 8px, 4px, 4px);
}
仕様書
どの標準にも含まれていません。
ブラウザーの互換性
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
-moz-image-region |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Non-standard. Check cross-browser support before using.
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.