From d2866069686a54fb73bd305a21b68a324fa4353d Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 11 Nov 2021 00:18:37 +0900 Subject: `-moz` 系のプロパティの変換準備 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ja/web/css/-moz-context-properties/index.html | 99 -------------------- files/ja/web/css/-moz-context-properties/index.md | 99 ++++++++++++++++++++ files/ja/web/css/-moz-float-edge/index.html | 90 ------------------ files/ja/web/css/-moz-float-edge/index.md | 90 ++++++++++++++++++ .../css/-moz-force-broken-image-icon/index.html | 67 -------------- .../web/css/-moz-force-broken-image-icon/index.md | 67 ++++++++++++++ files/ja/web/css/-moz-orient/index.html | 80 ---------------- files/ja/web/css/-moz-orient/index.md | 80 ++++++++++++++++ .../css/-moz-outline-radius-bottomleft/index.html | 74 --------------- .../css/-moz-outline-radius-bottomleft/index.md | 74 +++++++++++++++ .../css/-moz-outline-radius-bottomright/index.html | 74 --------------- .../css/-moz-outline-radius-bottomright/index.md | 74 +++++++++++++++ .../web/css/-moz-outline-radius-topleft/index.html | 72 -------------- .../web/css/-moz-outline-radius-topleft/index.md | 72 ++++++++++++++ .../css/-moz-outline-radius-topright/index.html | 75 --------------- .../web/css/-moz-outline-radius-topright/index.md | 75 +++++++++++++++ files/ja/web/css/-moz-outline-radius/index.html | 103 --------------------- files/ja/web/css/-moz-outline-radius/index.md | 103 +++++++++++++++++++++ files/ja/web/css/-moz-user-input/index.html | 71 -------------- files/ja/web/css/-moz-user-input/index.md | 71 ++++++++++++++ 20 files changed, 805 insertions(+), 805 deletions(-) delete mode 100644 files/ja/web/css/-moz-context-properties/index.html create mode 100644 files/ja/web/css/-moz-context-properties/index.md delete mode 100644 files/ja/web/css/-moz-float-edge/index.html create mode 100644 files/ja/web/css/-moz-float-edge/index.md delete mode 100644 files/ja/web/css/-moz-force-broken-image-icon/index.html create mode 100644 files/ja/web/css/-moz-force-broken-image-icon/index.md delete mode 100644 files/ja/web/css/-moz-orient/index.html create mode 100644 files/ja/web/css/-moz-orient/index.md delete mode 100644 files/ja/web/css/-moz-outline-radius-bottomleft/index.html create mode 100644 files/ja/web/css/-moz-outline-radius-bottomleft/index.md delete mode 100644 files/ja/web/css/-moz-outline-radius-bottomright/index.html create mode 100644 files/ja/web/css/-moz-outline-radius-bottomright/index.md delete mode 100644 files/ja/web/css/-moz-outline-radius-topleft/index.html create mode 100644 files/ja/web/css/-moz-outline-radius-topleft/index.md delete mode 100644 files/ja/web/css/-moz-outline-radius-topright/index.html create mode 100644 files/ja/web/css/-moz-outline-radius-topright/index.md delete mode 100644 files/ja/web/css/-moz-outline-radius/index.html create mode 100644 files/ja/web/css/-moz-outline-radius/index.md delete mode 100644 files/ja/web/css/-moz-user-input/index.html create mode 100644 files/ja/web/css/-moz-user-input/index.md (limited to 'files') diff --git a/files/ja/web/css/-moz-context-properties/index.html b/files/ja/web/css/-moz-context-properties/index.html deleted file mode 100644 index 3576e0ea94..0000000000 --- a/files/ja/web/css/-moz-context-properties/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: '-moz-context-properties' -slug: Web/CSS/-moz-context-properties -tags: - - '-moz-context-properties' - - CSS - - CSS Property - - 'CSS:Mozilla Extensions' - - Experimental - - Needs Privileges - - Non-standard - - Reference - - 'recipe:css-property' -translation_of: Web/CSS/-moz-context-properties ---- -
{{CSSRef}}{{Non-standard_header}}
- -

-moz-context-properties プロパティは Firefox の特権モードで使用することができ、子に SVG 画像を持つ要素の指定されたプロパティの値を共有します。

- -

ウェブページで (例えば {{htmlelement("img")}} 要素または背景画像として) SVG 画像を参照する場合、 SVG 画像は埋め込み要素 (そのコンテキスト) と協調して、画像が埋め込み要素に設定されたプロパティ値を採用することがあります。これを行うにためは、埋め込み要素は -moz-context-properties プロパティの値として画像に使用可能にするプロパティの一覧を示す必要があります。 context-fill 値などを使用して、これらのプロパティを使用するように画像に意思表示する必要があります。

- -

構文

- -
/* キーワード値 */
--moz-context-properties: fill;
--moz-context-properties: fill, stroke;
-
-/* グローバル値 */
--moz-context-properties: inherit;
--moz-context-properties: initial;
--moz-context-properties: unset;
-
- -

値

- -
-
fill
-
画像に設定された fill の値を埋め込まれた SVG に伝えます。
-
stroke
-
画像に設定された stroke の値を埋め込まれた SVG に伝えます。
-
fill-opacity
-
画像に設定された fill-opacity の値を埋め込まれた SVG に伝えます。
-
stroke-opacity
-
画像に設定された stoke-opacity の値を埋め込まれた SVG に伝えます。
-
- -

公式定義

- -

{{CSSInfo}}

- -

形式文法

- -{{csssyntax}} - -

例

- -

SVG 画像への塗りつぶしとストロークの公開

- -

この例では、 <img> 要素を使用して埋め込まれた簡単な SVG を使用します。

- -

以下のように、最初に埋め込み SVG に伝えたい値のプロパティを -moz-context-properties プロパティで埋め込む要素に指定する必要があります。

- -
.img1 {
-  width: 100px;
-  height: 100px;
-  -moz-context-properties: fill, stroke;
-  fill: lime;
-  stroke: purple;
-}
- -

これを行うと、次のように SVG 画像は {{cssxref("fill")}} および {{cssxref("stroke")}} の値を使用することができるようになります。

- -
<img class="img1" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'>
-                       <rect width='100%' height='100%' stroke-width='30px'
-                       fill='context-fill red' stroke='context-stroke' fill-opacity='0.5'/></svg>">
- -

ここで、画像の src に単純な SVG 画像を含む data URI を設定しました。内部の <rect> は、 <img> 要素の {{cssxref("fill")}} および {{cssxref("stroke")}} から fill および stroke の値を取り、これらの値の context-fill/context-stroke キーワードに設定して、 fill には SVG が最上位ウィンドウに単独で読み込まれた場合 (コンテンツの値を提供するコンテキストの要素がない場合) に使われる代替色 (red) を設定します。なお、色が SVG に直接設定され、コンテキストの色も設定された場合、コンテキストの色は直接設定された色を上書きします。

- -
-

注: Github に動作するサンプルがあります。

-
- -

仕様書

- -

どの標準にも含まれていません。

- -

ブラウザーの互換性

- -

{{Compat("css.properties.-moz-context-properties")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-context-properties/index.md b/files/ja/web/css/-moz-context-properties/index.md new file mode 100644 index 0000000000..3576e0ea94 --- /dev/null +++ b/files/ja/web/css/-moz-context-properties/index.md @@ -0,0 +1,99 @@ +--- +title: '-moz-context-properties' +slug: Web/CSS/-moz-context-properties +tags: + - '-moz-context-properties' + - CSS + - CSS Property + - 'CSS:Mozilla Extensions' + - Experimental + - Needs Privileges + - Non-standard + - Reference + - 'recipe:css-property' +translation_of: Web/CSS/-moz-context-properties +--- +
{{CSSRef}}{{Non-standard_header}}
+ +

-moz-context-properties プロパティは Firefox の特権モードで使用することができ、子に SVG 画像を持つ要素の指定されたプロパティの値を共有します。

+ +

ウェブページで (例えば {{htmlelement("img")}} 要素または背景画像として) SVG 画像を参照する場合、 SVG 画像は埋め込み要素 (そのコンテキスト) と協調して、画像が埋め込み要素に設定されたプロパティ値を採用することがあります。これを行うにためは、埋め込み要素は -moz-context-properties プロパティの値として画像に使用可能にするプロパティの一覧を示す必要があります。 context-fill 値などを使用して、これらのプロパティを使用するように画像に意思表示する必要があります。

+ +

構文

+ +
/* キーワード値 */
+-moz-context-properties: fill;
+-moz-context-properties: fill, stroke;
+
+/* グローバル値 */
+-moz-context-properties: inherit;
+-moz-context-properties: initial;
+-moz-context-properties: unset;
+
+ +

値

+ +
+
fill
+
画像に設定された fill の値を埋め込まれた SVG に伝えます。
+
stroke
+
画像に設定された stroke の値を埋め込まれた SVG に伝えます。
+
fill-opacity
+
画像に設定された fill-opacity の値を埋め込まれた SVG に伝えます。
+
stroke-opacity
+
画像に設定された stoke-opacity の値を埋め込まれた SVG に伝えます。
+
+ +

公式定義

+ +

{{CSSInfo}}

+ +

形式文法

+ +{{csssyntax}} + +

例

+ +

SVG 画像への塗りつぶしとストロークの公開

+ +

この例では、 <img> 要素を使用して埋め込まれた簡単な SVG を使用します。

+ +

以下のように、最初に埋め込み SVG に伝えたい値のプロパティを -moz-context-properties プロパティで埋め込む要素に指定する必要があります。

+ +
.img1 {
+  width: 100px;
+  height: 100px;
+  -moz-context-properties: fill, stroke;
+  fill: lime;
+  stroke: purple;
+}
+ +

これを行うと、次のように SVG 画像は {{cssxref("fill")}} および {{cssxref("stroke")}} の値を使用することができるようになります。

+ +
<img class="img1" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'>
+                       <rect width='100%' height='100%' stroke-width='30px'
+                       fill='context-fill red' stroke='context-stroke' fill-opacity='0.5'/></svg>">
+ +

ここで、画像の src に単純な SVG 画像を含む data URI を設定しました。内部の <rect> は、 <img> 要素の {{cssxref("fill")}} および {{cssxref("stroke")}} から fill および stroke の値を取り、これらの値の context-fill/context-stroke キーワードに設定して、 fill には SVG が最上位ウィンドウに単独で読み込まれた場合 (コンテンツの値を提供するコンテキストの要素がない場合) に使われる代替色 (red) を設定します。なお、色が SVG に直接設定され、コンテキストの色も設定された場合、コンテキストの色は直接設定された色を上書きします。

+ +
+

注: Github に動作するサンプルがあります。

+
+ +

仕様書

+ +

どの標準にも含まれていません。

+ +

ブラウザーの互換性

+ +

{{Compat("css.properties.-moz-context-properties")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-float-edge/index.html b/files/ja/web/css/-moz-float-edge/index.html deleted file mode 100644 index 4c4692f70b..0000000000 --- a/files/ja/web/css/-moz-float-edge/index.html +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: '-moz-float-edge' -slug: Web/CSS/-moz-float-edge -tags: - - CSS - - CSS Property - - 'CSS:Mozilla Extensions' - - Layout - - NeedsCompatTable - - Non-standard - - 'recipe:css-property' -translation_of: Web/CSS/-moz-float-edge ---- -
{{CSSRef}}{{Non-standard_header}}
- -

非標準の -moz-float-edge CSS プロパティは要素の高さと幅のプロパティが margin 、border 、padding の厚さを含んでいるのかを指定します。

- -
/* Keyword values */
--moz-float-edge: border-box;
--moz-float-edge: content-box;
--moz-float-edge: margin-box;
--moz-float-edge: padding-box;
-
-/* Global values */
--moz-float-edge: inherit;
--moz-float-edge: initial;
--moz-float-edge: unset;
-
- -

構文

- -

値

- -
-
border-box
-
高さと幅のプロパティがコンテンツ、padding および border を含むが、margin は含まない。
-
content-box
-
高さと幅のプロパティがコンテンツを含むが、padding 、border および margin は含まない。
-
margin-box
-
高さと幅のプロパティがコンテンツ、padding 、 border および margin を含む。
-
padding-box
-
高さと幅のプロパティがコンテンツと padding を含むが、border および margin は含まない。
-
- -

形式定義

- -

{{CSSInfo}}

- -

形式文法

- -{{csssyntax}} - -

例

- -

HTML

- -
<div class="box"> 
-  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
-</div>
- -

CSS

- -
.box {
-  display: block;
-  height: 5px;
-  margin: 0.5em auto 0.5em auto;
-  color: gray;
-  -moz-float-edge: margin-box;
-  box-sizing: border-box;
-}
- -

結果

- -

{{ EmbedLiveSample('Examples') }}

- -

仕様書

- -

このプロパティはどの CSS 標準でも定義されていません。

- -

ブラウザの対応

- - - -

{{Compat("css.properties.-moz-float-edge")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-float-edge/index.md b/files/ja/web/css/-moz-float-edge/index.md new file mode 100644 index 0000000000..4c4692f70b --- /dev/null +++ b/files/ja/web/css/-moz-float-edge/index.md @@ -0,0 +1,90 @@ +--- +title: '-moz-float-edge' +slug: Web/CSS/-moz-float-edge +tags: + - CSS + - CSS Property + - 'CSS:Mozilla Extensions' + - Layout + - NeedsCompatTable + - Non-standard + - 'recipe:css-property' +translation_of: Web/CSS/-moz-float-edge +--- +
{{CSSRef}}{{Non-standard_header}}
+ +

非標準の -moz-float-edge CSS プロパティは要素の高さと幅のプロパティが margin 、border 、padding の厚さを含んでいるのかを指定します。

+ +
/* Keyword values */
+-moz-float-edge: border-box;
+-moz-float-edge: content-box;
+-moz-float-edge: margin-box;
+-moz-float-edge: padding-box;
+
+/* Global values */
+-moz-float-edge: inherit;
+-moz-float-edge: initial;
+-moz-float-edge: unset;
+
+ +

構文

+ +

値

+ +
+
border-box
+
高さと幅のプロパティがコンテンツ、padding および border を含むが、margin は含まない。
+
content-box
+
高さと幅のプロパティがコンテンツを含むが、padding 、border および margin は含まない。
+
margin-box
+
高さと幅のプロパティがコンテンツ、padding 、 border および margin を含む。
+
padding-box
+
高さと幅のプロパティがコンテンツと padding を含むが、border および margin は含まない。
+
+ +

形式定義

+ +

{{CSSInfo}}

+ +

形式文法

+ +{{csssyntax}} + +

例

+ +

HTML

+ +
<div class="box"> 
+  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+</div>
+ +

CSS

+ +
.box {
+  display: block;
+  height: 5px;
+  margin: 0.5em auto 0.5em auto;
+  color: gray;
+  -moz-float-edge: margin-box;
+  box-sizing: border-box;
+}
+ +

結果

+ +

{{ EmbedLiveSample('Examples') }}

+ +

仕様書

+ +

このプロパティはどの CSS 標準でも定義されていません。

+ +

ブラウザの対応

+ + + +

{{Compat("css.properties.-moz-float-edge")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-force-broken-image-icon/index.html b/files/ja/web/css/-moz-force-broken-image-icon/index.html deleted file mode 100644 index d105691dd5..0000000000 --- a/files/ja/web/css/-moz-force-broken-image-icon/index.html +++ /dev/null @@ -1,67 +0,0 @@ ---- -title: '-moz-force-broken-image-icon' -slug: Web/CSS/-moz-force-broken-image-icon -tags: - - CSS - - NeedsCompatTable - - Non-standard - - Reference -translation_of: Web/CSS/-moz-force-broken-image-icon ---- -
{{Non-standard_header}}{{CSSRef}}
- -

Mozillaの拡張CSSプロパティである -moz-force-broken-image-icon は、画像が壊れているときに表示されるイメージアイコンを、たとえ alt 属性を持っていたとしても、強制的に表示させるために使用されます。

- -

{{cssinfo}}

- -

構文

- -

Values

- -
-
{{cssxref("<integer>")}}
-
プロパティの値に 1 を指定した場合、その画像が {{HTMLElement("img", "alt", "#attr-alt")}} 属性を持っていたとしても、壊れたイメージアイコンが表示されます。0 を指定した場合、通常通り alt 属性のみが表示されます。
-
- -
注: プロパティの値に 1 を指定した場合もなお、 alt 属性は壊れたイメージアイコンの隣に同時に表示されます。
- -

Formal syntax

- -{{csssyntax}} - -

例

- -

HTML

- -
<img src='/broken/image/link.png' alt='Broken image link'>
- -

CSS

- -
img {
-  -moz-force-broken-image-icon: 1;
-  height: 100px;
-  width: 100px;
-}
- -

Result

- -

{{ EmbedLiveSample('Example','125','125','/files/4619/broken%20image%20link.png') }}

- -
注: -moz-force-broken-image-icon の値に 1 を指定した場合、その画像にwidthとheightを明示的に指定しない限り、壊れたイメージアイコンは表示されず、 alt 属性も非表示になります。
- -

注記

- - - -

仕様

- -

どの仕様にも記載されていません。

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-force-broken-image-icon/index.md b/files/ja/web/css/-moz-force-broken-image-icon/index.md new file mode 100644 index 0000000000..d105691dd5 --- /dev/null +++ b/files/ja/web/css/-moz-force-broken-image-icon/index.md @@ -0,0 +1,67 @@ +--- +title: '-moz-force-broken-image-icon' +slug: Web/CSS/-moz-force-broken-image-icon +tags: + - CSS + - NeedsCompatTable + - Non-standard + - Reference +translation_of: Web/CSS/-moz-force-broken-image-icon +--- +
{{Non-standard_header}}{{CSSRef}}
+ +

Mozillaの拡張CSSプロパティである -moz-force-broken-image-icon は、画像が壊れているときに表示されるイメージアイコンを、たとえ alt 属性を持っていたとしても、強制的に表示させるために使用されます。

+ +

{{cssinfo}}

+ +

構文

+ +

Values

+ +
+
{{cssxref("<integer>")}}
+
プロパティの値に 1 を指定した場合、その画像が {{HTMLElement("img", "alt", "#attr-alt")}} 属性を持っていたとしても、壊れたイメージアイコンが表示されます。0 を指定した場合、通常通り alt 属性のみが表示されます。
+
+ +
注: プロパティの値に 1 を指定した場合もなお、 alt 属性は壊れたイメージアイコンの隣に同時に表示されます。
+ +

Formal syntax

+ +{{csssyntax}} + +

例

+ +

HTML

+ +
<img src='/broken/image/link.png' alt='Broken image link'>
+ +

CSS

+ +
img {
+  -moz-force-broken-image-icon: 1;
+  height: 100px;
+  width: 100px;
+}
+ +

Result

+ +

{{ EmbedLiveSample('Example','125','125','/files/4619/broken%20image%20link.png') }}

+ +
注: -moz-force-broken-image-icon の値に 1 を指定した場合、その画像にwidthとheightを明示的に指定しない限り、壊れたイメージアイコンは表示されず、 alt 属性も非表示になります。
+ +

注記

+ + + +

仕様

+ +

どの仕様にも記載されていません。

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-orient/index.html b/files/ja/web/css/-moz-orient/index.html deleted file mode 100644 index 361c8e08f9..0000000000 --- a/files/ja/web/css/-moz-orient/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: '-moz-orient' -slug: Web/CSS/-moz-orient -tags: - - CSS - - CSS プロパティ - - Mozilla 拡張 - - Non-standard - - Reference -translation_of: Web/CSS/-moz-orient ---- -
{{CSSRef}}{{Non-standard_header}}
- -

CSS の -moz-orient プロパティは、適用される要素の向きを指定します。

- -

{{cssinfo}}

- -

構文

- -

-moz-orient プロパティは、以下の一覧にあるキーワード値のうちの一つで指定します。

- -

値

- -
-
inline
-
要素をテキストの軸と同じ方向に描画します。横書きモードでは水平方向に、縦書きモードでは垂直方向に描画します。
-
block
-
要素をテキストの軸と直交するように描画します。横書きモードでは垂直方向に、縦書きモードでは水平方向に描画します。
-
horizontal
-
要素が水平方向に描画される
-
vertical
-
要素が垂直方向に描画される
-
- -

形式文法

- -{{csssyntax}} - -

例

- -

HTML

- -
<p>
-  The following progress meter
-  is horizontal (the default):
-</p>
-<progress max="100" value="75"></progress>
-
-<p>
- The following progress meter
- is vertical:
-</p>
-<progress class="vert" max="100" value="75"></progress>
- -

CSS

- -
.vert {
-  -moz-orient: vertical;
-  width: 16px;
-  height: 150px;
-}
- -

結果

- -

{{EmbedLiveSample("Examples","200","360")}}

- -

仕様書

- -

W3C に提出され、最初の反応は肯定的でしたが、このプロパティはまだ仕様書には含まれていません。今のところ、 Mozilla 独自の拡張 (つまり、 -moz-orient) です。

- -

ブラウザーの対応

- - -

{{Compat("css.properties.-moz-orient")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-orient/index.md b/files/ja/web/css/-moz-orient/index.md new file mode 100644 index 0000000000..361c8e08f9 --- /dev/null +++ b/files/ja/web/css/-moz-orient/index.md @@ -0,0 +1,80 @@ +--- +title: '-moz-orient' +slug: Web/CSS/-moz-orient +tags: + - CSS + - CSS プロパティ + - Mozilla 拡張 + - Non-standard + - Reference +translation_of: Web/CSS/-moz-orient +--- +
{{CSSRef}}{{Non-standard_header}}
+ +

CSS の -moz-orient プロパティは、適用される要素の向きを指定します。

+ +

{{cssinfo}}

+ +

構文

+ +

-moz-orient プロパティは、以下の一覧にあるキーワード値のうちの一つで指定します。

+ +

値

+ +
+
inline
+
要素をテキストの軸と同じ方向に描画します。横書きモードでは水平方向に、縦書きモードでは垂直方向に描画します。
+
block
+
要素をテキストの軸と直交するように描画します。横書きモードでは垂直方向に、縦書きモードでは水平方向に描画します。
+
horizontal
+
要素が水平方向に描画される
+
vertical
+
要素が垂直方向に描画される
+
+ +

形式文法

+ +{{csssyntax}} + +

例

+ +

HTML

+ +
<p>
+  The following progress meter
+  is horizontal (the default):
+</p>
+<progress max="100" value="75"></progress>
+
+<p>
+ The following progress meter
+ is vertical:
+</p>
+<progress class="vert" max="100" value="75"></progress>
+ +

CSS

+ +
.vert {
+  -moz-orient: vertical;
+  width: 16px;
+  height: 150px;
+}
+ +

結果

+ +

{{EmbedLiveSample("Examples","200","360")}}

+ +

仕様書

+ +

W3C に提出され、最初の反応は肯定的でしたが、このプロパティはまだ仕様書には含まれていません。今のところ、 Mozilla 独自の拡張 (つまり、 -moz-orient) です。

+ +

ブラウザーの対応

+ + +

{{Compat("css.properties.-moz-orient")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-outline-radius-bottomleft/index.html b/files/ja/web/css/-moz-outline-radius-bottomleft/index.html deleted file mode 100644 index dfe9f8e8b6..0000000000 --- a/files/ja/web/css/-moz-outline-radius-bottomleft/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: '-moz-outline-radius-bottomleft' -slug: Web/CSS/-moz-outline-radius-bottomleft -tags: - - CSS - - CSS Property - - NeedsCompatTable - - NeedsContent - - Non-standard - - Reference - - 'recipe:css-property' -translation_of: Web/CSS/-moz-outline-radius-bottomleft ---- -
{{Non-standard_header}}{{CSSRef}}
- -

Mozilla アプリケーションにおいて、 -moz-outline-radius-bottomleft は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の左下の角を丸くするために使用することができます。

- -

構文

- -

-moz-outline-radius-bottomleft の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

- -

値

- -
-
<length>
-
要素の下端と左端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
-
<percentage>
-
要素の左下隅の丸めを定義する円の半径で、ボーダーボックスの下辺と左辺のパーセント値で指定します。
-
- -

公式定義

- -

{{cssinfo}}

- -

形式文法

- -{{csssyntax}} - -

例

- -

アウトラインを丸める

- -

これは Firefox 専用のプロパティなので、この例では Firefox 以外のブラウザーで表示している場合は、期待した効果が表示されません。

- -

HTML

- -
<p>Look at this paragraph's bottom-left corner.</p>
- -

CSS

- -
p {
-  margin: 10px;
-  border: solid cyan;
-  outline: dotted green;
-  -moz-outline-radius-bottomleft: 2em;
-}
- -

結果

- -

{{EmbedLiveSample("Rounding_a_outline")}}

- -

仕様書

- -

標準の一部ではありません。

- -

ブラウザーの互換性

- -

{{Compat("css.properties.-moz-outline-radius-bottomleft")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-outline-radius-bottomleft/index.md b/files/ja/web/css/-moz-outline-radius-bottomleft/index.md new file mode 100644 index 0000000000..dfe9f8e8b6 --- /dev/null +++ b/files/ja/web/css/-moz-outline-radius-bottomleft/index.md @@ -0,0 +1,74 @@ +--- +title: '-moz-outline-radius-bottomleft' +slug: Web/CSS/-moz-outline-radius-bottomleft +tags: + - CSS + - CSS Property + - NeedsCompatTable + - NeedsContent + - Non-standard + - Reference + - 'recipe:css-property' +translation_of: Web/CSS/-moz-outline-radius-bottomleft +--- +
{{Non-standard_header}}{{CSSRef}}
+ +

Mozilla アプリケーションにおいて、 -moz-outline-radius-bottomleft は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の左下の角を丸くするために使用することができます。

+ +

構文

+ +

-moz-outline-radius-bottomleft の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

+ +

値

+ +
+
<length>
+
要素の下端と左端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
+
<percentage>
+
要素の左下隅の丸めを定義する円の半径で、ボーダーボックスの下辺と左辺のパーセント値で指定します。
+
+ +

公式定義

+ +

{{cssinfo}}

+ +

形式文法

+ +{{csssyntax}} + +

例

+ +

アウトラインを丸める

+ +

これは Firefox 専用のプロパティなので、この例では Firefox 以外のブラウザーで表示している場合は、期待した効果が表示されません。

+ +

HTML

+ +
<p>Look at this paragraph's bottom-left corner.</p>
+ +

CSS

+ +
p {
+  margin: 10px;
+  border: solid cyan;
+  outline: dotted green;
+  -moz-outline-radius-bottomleft: 2em;
+}
+ +

結果

+ +

{{EmbedLiveSample("Rounding_a_outline")}}

+ +

仕様書

+ +

標準の一部ではありません。

+ +

ブラウザーの互換性

+ +

{{Compat("css.properties.-moz-outline-radius-bottomleft")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-outline-radius-bottomright/index.html b/files/ja/web/css/-moz-outline-radius-bottomright/index.html deleted file mode 100644 index 629fb0ee20..0000000000 --- a/files/ja/web/css/-moz-outline-radius-bottomright/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: '-moz-outline-radius-bottomright' -slug: Web/CSS/-moz-outline-radius-bottomright -tags: - - CSS - - CSS Property - - NeedsCompatTable - - NeedsContent - - Non-standard - - Reference - - 'recipe:css-property' -translation_of: Web/CSS/-moz-outline-radius-bottomright ---- -
{{Non-standard_header}}{{CSSRef}}
- -

Mozilla アプリケーションにおいて、 -moz-outline-radius-bottomright は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の右下の角を丸くするために使用することができます。

- -

構文

- -

-moz-outline-radius-bottomright の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

- -

値

- -
-
<length>
-
要素の下端と右端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
-
<percentage>
-
要素の右下隅の丸めを定義する円の半径で、ボーダーボックスの下辺と右辺のパーセント値で指定します。
-
- -

公式定義

- -

{{CSSInfo}}

- -

形式文法

- -{{CSSSyntax}} - -

例

- -

HTML

- -
<p>Look at this paragraph's bottom-right corner.</p>
- -

CSS

- -
p {
-  margin: 5px;
-  border: solid cyan;
-  outline: dotted red;
-  -moz-outline-radius-bottomright: 2em;
-}
- -

結果

- -

{{EmbedLiveSample("Examples")}}

- -
-

注: 上記の例は、 Firefox 以外のブラウザーで表示させると、期待通りの効果が表示されません。

-
- -

仕様書

- -

標準の一部ではありません。

- -

ブラウザーの互換性

- -

{{Compat("css.properties.-moz-outline-radius-bottomright")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-outline-radius-bottomright/index.md b/files/ja/web/css/-moz-outline-radius-bottomright/index.md new file mode 100644 index 0000000000..629fb0ee20 --- /dev/null +++ b/files/ja/web/css/-moz-outline-radius-bottomright/index.md @@ -0,0 +1,74 @@ +--- +title: '-moz-outline-radius-bottomright' +slug: Web/CSS/-moz-outline-radius-bottomright +tags: + - CSS + - CSS Property + - NeedsCompatTable + - NeedsContent + - Non-standard + - Reference + - 'recipe:css-property' +translation_of: Web/CSS/-moz-outline-radius-bottomright +--- +
{{Non-standard_header}}{{CSSRef}}
+ +

Mozilla アプリケーションにおいて、 -moz-outline-radius-bottomright は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の右下の角を丸くするために使用することができます。

+ +

構文

+ +

-moz-outline-radius-bottomright の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

+ +

値

+ +
+
<length>
+
要素の下端と右端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
+
<percentage>
+
要素の右下隅の丸めを定義する円の半径で、ボーダーボックスの下辺と右辺のパーセント値で指定します。
+
+ +

公式定義

+ +

{{CSSInfo}}

+ +

形式文法

+ +{{CSSSyntax}} + +

例

+ +

HTML

+ +
<p>Look at this paragraph's bottom-right corner.</p>
+ +

CSS

+ +
p {
+  margin: 5px;
+  border: solid cyan;
+  outline: dotted red;
+  -moz-outline-radius-bottomright: 2em;
+}
+ +

結果

+ +

{{EmbedLiveSample("Examples")}}

+ +
+

注: 上記の例は、 Firefox 以外のブラウザーで表示させると、期待通りの効果が表示されません。

+
+ +

仕様書

+ +

標準の一部ではありません。

+ +

ブラウザーの互換性

+ +

{{Compat("css.properties.-moz-outline-radius-bottomright")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-outline-radius-topleft/index.html b/files/ja/web/css/-moz-outline-radius-topleft/index.html deleted file mode 100644 index 0d0d4e9f4e..0000000000 --- a/files/ja/web/css/-moz-outline-radius-topleft/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: '-moz-outline-radius-topleft' -slug: Web/CSS/-moz-outline-radius-topleft -tags: - - CSS - - CSS Property - - NeedsCompatTable - - NeedsContent - - Non-standard - - Reference - - 'recipe:css-property' -translation_of: Web/CSS/-moz-outline-radius-topleft ---- -
{{Non-standard_header}}{{CSSRef}}
- -

Mozilla アプリケーションにおいて、 -moz-outline-radius-topleft は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の左上の角を丸くするために使用することができます。

- -

構文

- -

-moz-outline-radius-topleft の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

- -

値

- -
-
<length>
-
要素の上端と左端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
-
<percentage>
-
要素の左上隅の丸めを定義する円の半径で、ボーダーボックスの上辺と左辺のパーセント値で指定します。
-
- -

公式定義

- -

{{CSSInfo}}

- -

形式文法

- -{{CSSSyntax}} - -

例

- -

下記の例は Firefox 以外のブラウザーで見ている場合は、求められる効果が表示されません。

- -

HTML

- -
<p>段落の左上の角を見てください。</p>
- -

CSS

- -
p {
-  margin: 5px;
-  border: solid cyan;
-  outline: dotted red;
-  -moz-outline-radius-topleft: 2em;
-}
- -

結果

- -

{{EmbedLiveSample("Examples")}}

- -

仕様書

- -

標準の一部ではありません。

- -

ブラウザーの互換性

- -

{{Compat("css.properties.-moz-outline-radius-topleft")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-outline-radius-topleft/index.md b/files/ja/web/css/-moz-outline-radius-topleft/index.md new file mode 100644 index 0000000000..0d0d4e9f4e --- /dev/null +++ b/files/ja/web/css/-moz-outline-radius-topleft/index.md @@ -0,0 +1,72 @@ +--- +title: '-moz-outline-radius-topleft' +slug: Web/CSS/-moz-outline-radius-topleft +tags: + - CSS + - CSS Property + - NeedsCompatTable + - NeedsContent + - Non-standard + - Reference + - 'recipe:css-property' +translation_of: Web/CSS/-moz-outline-radius-topleft +--- +
{{Non-standard_header}}{{CSSRef}}
+ +

Mozilla アプリケーションにおいて、 -moz-outline-radius-topleft は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の左上の角を丸くするために使用することができます。

+ +

構文

+ +

-moz-outline-radius-topleft の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

+ +

値

+ +
+
<length>
+
要素の上端と左端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
+
<percentage>
+
要素の左上隅の丸めを定義する円の半径で、ボーダーボックスの上辺と左辺のパーセント値で指定します。
+
+ +

公式定義

+ +

{{CSSInfo}}

+ +

形式文法

+ +{{CSSSyntax}} + +

例

+ +

下記の例は Firefox 以外のブラウザーで見ている場合は、求められる効果が表示されません。

+ +

HTML

+ +
<p>段落の左上の角を見てください。</p>
+ +

CSS

+ +
p {
+  margin: 5px;
+  border: solid cyan;
+  outline: dotted red;
+  -moz-outline-radius-topleft: 2em;
+}
+ +

結果

+ +

{{EmbedLiveSample("Examples")}}

+ +

仕様書

+ +

標準の一部ではありません。

+ +

ブラウザーの互換性

+ +

{{Compat("css.properties.-moz-outline-radius-topleft")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-outline-radius-topright/index.html b/files/ja/web/css/-moz-outline-radius-topright/index.html deleted file mode 100644 index d1643bd009..0000000000 --- a/files/ja/web/css/-moz-outline-radius-topright/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: '-moz-outline-radius-topright' -slug: Web/CSS/-moz-outline-radius-topright -tags: - - CSS - - CSS Property - - NeedsCompatTable - - NeedsContent - - Non-standard - - Reference - - 'recipe:css-property' -translation_of: Web/CSS/-moz-outline-radius-topright ---- -
{{Non-standard_header}}{{CSSRef}}
- -

Mozilla アプリケーションにおいて、 -moz-outline-radius-topright は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の⇀上の角を丸くするために使用することができます。

- -

構文

- -

-moz-outline-radius-topright の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

- -

値

- -
-
<length>
-
要素の上端と右端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
-
<percentage>
-
要素の右上隅の丸めを定義する円の半径で、ボーダーボックスの上辺と右辺のパーセント値で指定します。
-
- -

公式定義

- -

{{CSSInfo}}

- -

形式文法

- -{{CSSSyntax}} - -

例

- -

HTML

- -
<p>段落の右上の角を見てください。</p>
- -

CSS

- -
p {
-  margin: 5px;
-  border: solid cyan;
-  outline: dotted red;
-  -moz-outline-radius-topright: 2em;
-}
- -

結果

- -

{{EmbedLiveSample("Examples")}}

- -
-

上記の例は Firefox 以外のブラウザーで見ている場合は、求められる効果が表示されません。

-
- -

仕様書

- -

標準の一部ではありません。

- -

ブラウザーの互換性

- - -

{{Compat("css.properties.-moz-outline-radius-topright")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-outline-radius-topright/index.md b/files/ja/web/css/-moz-outline-radius-topright/index.md new file mode 100644 index 0000000000..d1643bd009 --- /dev/null +++ b/files/ja/web/css/-moz-outline-radius-topright/index.md @@ -0,0 +1,75 @@ +--- +title: '-moz-outline-radius-topright' +slug: Web/CSS/-moz-outline-radius-topright +tags: + - CSS + - CSS Property + - NeedsCompatTable + - NeedsContent + - Non-standard + - Reference + - 'recipe:css-property' +translation_of: Web/CSS/-moz-outline-radius-topright +--- +
{{Non-standard_header}}{{CSSRef}}
+ +

Mozilla アプリケーションにおいて、 -moz-outline-radius-topright は CSS のプロパティで、要素の輪郭線 ({{cssxref("outline")}}) の⇀上の角を丸くするために使用することができます。

+ +

構文

+ +

-moz-outline-radius-topright の値は、 {{cssxref("length", "<length>")}} または境界ボックスの対応する大きさに対するパーセント値のどちらかです。 {{cssxref("calc", "calc()")}} 関数も同様に使用することができます。

+ +

値

+ +
+
<length>
+
要素の上端と右端の曲率を定義する円の半径を CSS の {{cssxref("length", "<length>")}} で指定します。
+
<percentage>
+
要素の右上隅の丸めを定義する円の半径で、ボーダーボックスの上辺と右辺のパーセント値で指定します。
+
+ +

公式定義

+ +

{{CSSInfo}}

+ +

形式文法

+ +{{CSSSyntax}} + +

例

+ +

HTML

+ +
<p>段落の右上の角を見てください。</p>
+ +

CSS

+ +
p {
+  margin: 5px;
+  border: solid cyan;
+  outline: dotted red;
+  -moz-outline-radius-topright: 2em;
+}
+ +

結果

+ +

{{EmbedLiveSample("Examples")}}

+ +
+

上記の例は Firefox 以外のブラウザーで見ている場合は、求められる効果が表示されません。

+
+ +

仕様書

+ +

標準の一部ではありません。

+ +

ブラウザーの互換性

+ + +

{{Compat("css.properties.-moz-outline-radius-topright")}}

+ +

関連情報

+ + diff --git a/files/ja/web/css/-moz-outline-radius/index.html b/files/ja/web/css/-moz-outline-radius/index.html deleted file mode 100644 index f8e21bd877..0000000000 --- a/files/ja/web/css/-moz-outline-radius/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: '-moz-outline-radius' -slug: Web/CSS/-moz-outline-radius -tags: - - '-moz-outline-radius' - - '-moz-outline-radius-bottomleft' - - '-moz-outline-radius-bottomright' - - '-moz-outline-radius-topleft' - - '-moz-outline-radius-topright' - - CSS - - CSS プロパティ - - Mozilla 拡張 - - Non-standard - - Reference -translation_of: Web/CSS/-moz-outline-radius ---- -
{{CSSRef}}{{Non-standard_header}}
- -

Firefox などの Mozilla アプリケーションにおいて、 CSS の -moz-outline-radius プロパティは、要素の輪郭線 ({{cssxref("outline")}}) の角を丸くするために使用することができます。

- -
/* 1つの値 */
--moz-outline-radius: 25px;
-
-/* 2つの値 */
--moz-outline-radius: 25px 1em;
-
-/* 3つの値 */
--moz-outline-radius: 25px 1em 12%;
-
-/* 4つの値 */
--moz-outline-radius: 25px 1em 12% 4mm;
-
-/* グローバル値 */
--moz-outline-radius: inherit;
--moz-outline-radius: initial;
--moz-outline-radius: unset;
-
- -

このプロパティは、一括指定であり、4つのプロパティ {{cssxref("-moz-outline-radius-topleft")}}, {{cssxref("-moz-outline-radius-topright")}}, {{cssxref("-moz-outline-radius-bottomright")}}, {{cssxref("-moz-outline-radius-bottomleft")}} を設定します。

- -

{{cssinfo}}

- -

構文

- -

値

- -
楕円形の輪郭線や <percentage> の値は、 {{cssxref("border-radius")}} で説明されている構文に従います。
- -

1～4つの <outline-radius> 値で、次のうちの一つを表します。

- -
-
{{cssxref("<length>")}}
-
取りうる値については {{cssxref("<length>")}} をご覧ください。
-
{{cssxref("<percentage>")}}
-
{{cssxref("<percentage>")}}。詳しくは {{cssxref("border-radius")}} を参照してください。
-
- - - -

形式文法

- -{{csssyntax}} - -

例

- -

HTML

- -
<p>This element has a rounded outline!</p>
- -

CSS

- -
p {
-  margin: 5px;
-  border: 1px solid black;
-  outline: dotted red;
-  -moz-outline-radius: 12% 1em 25px;
-}
- -

結果

- -

{{EmbedLiveSample('Example')}}

- -

注: 上記の例は、 Firefox 以外のブラウザーで表示させると、期待通りの効果が表示されません。

- -

メモ

- - - -

仕様書

- -

このプロパティはどの CSS 標準で定義されていません。

- -

ブラウザーの互換性

- -

{{Compat("css.properties.-moz-outline-radius")}}

diff --git a/files/ja/web/css/-moz-outline-radius/index.md b/files/ja/web/css/-moz-outline-radius/index.md new file mode 100644 index 0000000000..f8e21bd877 --- /dev/null +++ b/files/ja/web/css/-moz-outline-radius/index.md @@ -0,0 +1,103 @@ +--- +title: '-moz-outline-radius' +slug: Web/CSS/-moz-outline-radius +tags: + - '-moz-outline-radius' + - '-moz-outline-radius-bottomleft' + - '-moz-outline-radius-bottomright' + - '-moz-outline-radius-topleft' + - '-moz-outline-radius-topright' + - CSS + - CSS プロパティ + - Mozilla 拡張 + - Non-standard + - Reference +translation_of: Web/CSS/-moz-outline-radius +--- +
{{CSSRef}}{{Non-standard_header}}
+ +

Firefox などの Mozilla アプリケーションにおいて、 CSS の -moz-outline-radius プロパティは、要素の輪郭線 ({{cssxref("outline")}}) の角を丸くするために使用することができます。

+ +
/* 1つの値 */
+-moz-outline-radius: 25px;
+
+/* 2つの値 */
+-moz-outline-radius: 25px 1em;
+
+/* 3つの値 */
+-moz-outline-radius: 25px 1em 12%;
+
+/* 4つの値 */
+-moz-outline-radius: 25px 1em 12% 4mm;
+
+/* グローバル値 */
+-moz-outline-radius: inherit;
+-moz-outline-radius: initial;
+-moz-outline-radius: unset;
+
+ +

このプロパティは、一括指定であり、4つのプロパティ {{cssxref("-moz-outline-radius-topleft")}}, {{cssxref("-moz-outline-radius-topright")}}, {{cssxref("-moz-outline-radius-bottomright")}}, {{cssxref("-moz-outline-radius-bottomleft")}} を設定します。

+ +

{{cssinfo}}

+ +

構文

+ +

値

+ +
楕円形の輪郭線や <percentage> の値は、 {{cssxref("border-radius")}} で説明されている構文に従います。
+ +

1～4つの <outline-radius> 値で、次のうちの一つを表します。

+ +
+
{{cssxref("<length>")}}
+
取りうる値については {{cssxref("<length>")}} をご覧ください。
+
{{cssxref("<percentage>")}}
+
{{cssxref("<percentage>")}}。詳しくは {{cssxref("border-radius")}} を参照してください。
+
+ + + +

形式文法

+ +{{csssyntax}} + +

例

+ +

HTML

+ +
<p>This element has a rounded outline!</p>
+ +

CSS

+ +
p {
+  margin: 5px;
+  border: 1px solid black;
+  outline: dotted red;
+  -moz-outline-radius: 12% 1em 25px;
+}
+ +

結果

+ +

{{EmbedLiveSample('Example')}}

+ +

注: 上記の例は、 Firefox 以外のブラウザーで表示させると、期待通りの効果が表示されません。

+ +

メモ

+ + + +

仕様書

+ +

このプロパティはどの CSS 標準で定義されていません。

+ +

ブラウザーの互換性

+ +

{{Compat("css.properties.-moz-outline-radius")}}

diff --git a/files/ja/web/css/-moz-user-input/index.html b/files/ja/web/css/-moz-user-input/index.html deleted file mode 100644 index aba350c66b..0000000000 --- a/files/ja/web/css/-moz-user-input/index.html +++ /dev/null @@ -1,71 +0,0 @@ ---- -title: '-moz-user-input' -slug: Web/CSS/-moz-user-input -tags: - - CSS - - CSS Property - - Deprecated - - Mozilla 拡張 - - Non-standard - - Reference -translation_of: Web/CSS/-moz-user-input ---- -
{{CSSRef}}{{Non-standard_Header}}{{Deprecated_Header(60)}}
- -

Mozilla アプリケーションでは、 -moz-user-input はある要素がユーザの入力を受け付けるかどうかを決定します。

- -
/* キーワード値 */
--moz-user-input: none;
--moz-user-input: enabled;
--moz-user-input: disabled;
-
-/* グローバル値 */
--moz-user-input: inherit;
--moz-user-input: initial;
--moz-user-input: unset;
-
- -

{{HTMLElement("textarea")}} のようなユーザーからの入力を通常受け付ける要素では -moz-user-input の初期値は enabled です。

- -
-

メモ: -moz-user-input は、 CSS 3 {{cssxref("user-input")}} プロパティの先行実装案の一つでしたが、これはまだ (実装を要求する) 勧告候補に達していません。類似のプロパティ user-focus が CSS3 UI 仕様の前身であった初期の草稿 で提案されましたが、ワーキンググループによって却下されました。

-
- -

{{CSSInfo}}

- -

構文

- -

値

- -
-
none
-
要素はユーザーからの入力に反応せず {{CSSxRef(":active")}} にならない。
-
enabled
-
要素はユーザーからの入力を受け付ける。テキストボックスではこれが標準の動作。この値は Firefox 60 以降は対応していませんので注意してください ({{bug(1405087)}})。
-
disabled
-
要素はユーザーからの入力を受け付けない。しかし、これは {{XULAttr("disabled")}} を true にするのとは等しくなく、要素は普通に (無効にならずに) 描画される。この値は Firefox 60 以降でサポートしませんので注意してください ({{bug(1405087)}})。
-
- -

形式文法

- -{{CSSSyntax}} - -

例

- -
input.example {
-  /* ユーザーはテキストの選択はできますが変更はできません。 */
-  -moz-user-input: disabled;
-}
-
- -

ブラウザーの対応

- -

{{Compat("css.properties.-moz-user-input")}}

- -

関連情報

- - diff --git a/files/ja/web/css/-moz-user-input/index.md b/files/ja/web/css/-moz-user-input/index.md new file mode 100644 index 0000000000..aba350c66b --- /dev/null +++ b/files/ja/web/css/-moz-user-input/index.md @@ -0,0 +1,71 @@ +--- +title: '-moz-user-input' +slug: Web/CSS/-moz-user-input +tags: + - CSS + - CSS Property + - Deprecated + - Mozilla 拡張 + - Non-standard + - Reference +translation_of: Web/CSS/-moz-user-input +--- +
{{CSSRef}}{{Non-standard_Header}}{{Deprecated_Header(60)}}
+ +

Mozilla アプリケーションでは、 -moz-user-input はある要素がユーザの入力を受け付けるかどうかを決定します。

+ +
/* キーワード値 */
+-moz-user-input: none;
+-moz-user-input: enabled;
+-moz-user-input: disabled;
+
+/* グローバル値 */
+-moz-user-input: inherit;
+-moz-user-input: initial;
+-moz-user-input: unset;
+
+ +

{{HTMLElement("textarea")}} のようなユーザーからの入力を通常受け付ける要素では -moz-user-input の初期値は enabled です。

+ +
+

メモ: -moz-user-input は、 CSS 3 {{cssxref("user-input")}} プロパティの先行実装案の一つでしたが、これはまだ (実装を要求する) 勧告候補に達していません。類似のプロパティ user-focus が CSS3 UI 仕様の前身であった初期の草稿 で提案されましたが、ワーキンググループによって却下されました。

+
+ +

{{CSSInfo}}

+ +

構文

+ +

値

+ +
+
none
+
要素はユーザーからの入力に反応せず {{CSSxRef(":active")}} にならない。
+
enabled
+
要素はユーザーからの入力を受け付ける。テキストボックスではこれが標準の動作。この値は Firefox 60 以降は対応していませんので注意してください ({{bug(1405087)}})。
+
disabled
+
要素はユーザーからの入力を受け付けない。しかし、これは {{XULAttr("disabled")}} を true にするのとは等しくなく、要素は普通に (無効にならずに) 描画される。この値は Firefox 60 以降でサポートしませんので注意してください ({{bug(1405087)}})。
+
+ +

形式文法

+ +{{CSSSyntax}} + +

例

+ +
input.example {
+  /* ユーザーはテキストの選択はできますが変更はできません。 */
+  -moz-user-input: disabled;
+}
+
+ +

ブラウザーの対応

+ +

{{Compat("css.properties.-moz-user-input")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf