From eee30f4151ee1ca25b197633462730ee09c7acf0 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 6 Jan 2022 22:46:22 +0900 Subject: 2021/08/13 時点の英語版に同期 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ja/web/css/filter-function/opacity()/index.md | 98 ++++++++++------------ 1 file changed, 44 insertions(+), 54 deletions(-) (limited to 'files/ja/web') diff --git a/files/ja/web/css/filter-function/opacity()/index.md b/files/ja/web/css/filter-function/opacity()/index.md index 0d1f304a27..edee2ef5b5 100644 --- a/files/ja/web/css/filter-function/opacity()/index.md +++ b/files/ja/web/css/filter-function/opacity()/index.md @@ -3,70 +3,60 @@ title: opacity() slug: Web/CSS/filter-function/opacity() tags: - CSS - - CSS Function - - Filter Effects - - Function - - Reference + - CSS 関数 + - フィルター効果 + - 関数 + - リファレンス +browser-compat: css.types.filter-function.opacity translation_of: Web/CSS/filter-function/opacity() --- -
{{cssref}}
+{{CSSRef}} -

opacity()CSS の関数で、入力画像のサンプルに透過性を適用します。結果は {{cssxref("<filter-function>")}} です。

+**`opacity()`** は [CSS](/ja/docs/Web/CSS) の[関数](/ja/docs/Web/CSS/CSS_Functions)で、入力画像のサンプルに透過性を適用します。結果は {{cssxref("<filter-function>")}} です。 -
{{EmbedInteractiveExample("pages/css/function-opacity.html")}}
+{{EmbedInteractiveExample("pages/css/function-opacity.html")}} - +> **Note:** この関数はもっと一般的な {{Cssxref("opacity")}} プロパティと似ています。違いはフィルターの場合、ブラウザーによってはハードウェアアクセラレーションにより性能が上がることです。 -
-

注: この関数はもっと一般的な {{Cssxref("opacity")}} プロパティと似ています。違いはフィルターの場合、ブラウザーによってはハードウェアアクセラレーションにより性能が上がることです。

-
+## 構文 -

構文

+```css +opacity(amount) +``` -
opacity(amount)
+### 引数 -

引数

+- `amount` + - : 変換の度合いで、 {{cssxref("<number>")}} または {{cssxref("<percentage>")}} で指定します。 `0%` の値では完全に透明になり、 `100%` の値では入力が変更されないままになります。 `0%` と `100%` の間の値は、効果の割合です。補間時の欠損値は `1` です。 -
-
amount
-
変換の度合いで、 {{cssxref("<number>")}} または {{cssxref("<percentage>")}} で指定します。 100% の値では完全に透明になり、 0% の値では入力が変更されないままになります。 0%100% の間の値は、効果の割合です。補間時の欠損値は 0 です。
-
+## 例 -

+### opacity() の正しい値の例 -
opacity(0%)   /* 完全に透過 */
+```css
+opacity(0%)   /* 完全に透過 */
 opacity(50%)  /* 50% 透過 */
-opacity(1)    /* 効果なし */
- -

仕様書

- - - - - - - - - - - - - - -
仕様書状態
{{SpecName('Filters 1.0', '#funcdef-filter-opacity', 'opacity()')}}{{Spec2('Filters 1.0')}}
- -

関連情報

- - +opacity(1) /* 効果なし */ +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{cssxref("<filter-function>")}} +- CSS の {{cssxref("opacity")}} プロパティ +- {{cssxref("filter-function/blur()", "blur()")}} +- {{cssxref("filter-function/brightness()", "brightness()")}} +- {{cssxref("filter-function/contrast()", "contrast()")}} +- {{cssxref("filter-function/drop-shadow()", "drop-shadow()")}} +- {{cssxref("filter-function/grayscale()", "grayscale()")}} +- {{cssxref("filter-function/hue-rotate()", "hue-rotate()")}} +- {{cssxref("filter-function/invert()", "invert()")}} +- {{cssxref("filter-function/saturate()", "saturate()")}} +- {{cssxref("filter-function/sepia()", "sepia()")}} -- cgit v1.2.3-54-g00ecf