From 8651ee0f8384d02e8a312238288b8588dc3791cf Mon Sep 17 00:00:00 2001 From: rch850 Date: Tue, 16 Nov 2021 01:01:58 +0900 Subject: prefers-contrast の内容を英語に追従 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit high / low を more / less にするなど。 --- .../ja/web/css/@media/prefers-contrast/index.html | 25 +++++++++------------- 1 file changed, 10 insertions(+), 15 deletions(-) (limited to 'files/ja/web/css') diff --git a/files/ja/web/css/@media/prefers-contrast/index.html b/files/ja/web/css/@media/prefers-contrast/index.html index fb3d42ecf9..6c0229b29e 100644 --- a/files/ja/web/css/@media/prefers-contrast/index.html +++ b/files/ja/web/css/@media/prefers-contrast/index.html @@ -8,11 +8,7 @@ tags: - メディア特性 translation_of: Web/CSS/@media/prefers-contrast --- -
{{CSSRef}}{{SeeCompatTable}}{{draft}}
- -
-

注:この機能はどのユーザーエージェントも対応しておらず、仕様が変更されることがあります。

-
+
{{CSSRef}}{{SeeCompatTable}}

prefers-contrast は CSS のメディア特性で、ユーザーがウェブコンテンツをより高い (またはより低い) コントラストで表示するように要求したかどうかを検出するために使用します。

@@ -21,22 +17,18 @@ translation_of: Web/CSS/@media/prefers-contrast
no-preference
ユーザーが設定をシステムに通知していないことを示します。このキーワード値は、boolean のコンテキストでは false と評価されます。
-
high
+
more
ユーザーが、より高いコントラストをもつインターフェイスを好むことをシステムに通知したことを示します。
-
low
+
less
ユーザーが、より低いコントラストを持つインタフェース好むことをシステムに通知したことを示します。

ユーザー設定

-

現在のところ、この機能を実装しているユーザエージェントはありませんが、様々なオペレーティングシステムがこのような設定をサポートしており、このメディアクエリが実装されると、ユーザエージェントはおそらくオペレーティングシステムによって提供される設定に依存することになるでしょう。

+

様々なオペレーティングシステムがこのような設定をサポートしており、ユーザエージェントはオペレーティングシステムによって提供される設定に依存することになるでしょう。

例

-
-

注: 現在、この機能を実装しているブラウザはないため、次の例は動作しません。

-
-

この例では、既定でいまいましい低いコントラストが与えられています。

HTML

@@ -47,12 +39,14 @@ translation_of: Web/CSS/@media/prefers-contrast

CSS

.contrast {
-  color: grey;
+  width: 100px;
+  height: 100px;
+  outline: 2px dashed black;
 }
 
-@media (prefers-contrast: high) {
+@media (prefers-contrast: more) {
   .contrast {
-    color: black;
+    outline: 2px solid black;
   }
 }
@@ -88,6 +82,7 @@ translation_of: Web/CSS/@media/prefers-contrast

{{QuickLinksWithSubpages("/en-US/docs/Web/CSS/@media/")}}

-- cgit v1.2.3-54-g00ecf