From 828d451531b184ef07c53f24f850a39370298528 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Wed, 29 Dec 2021 22:14:06 +0900 Subject: Web/CSS/CSS_Scrollbars を変換準備 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/css/css_scrollbars/index.html | 96 ------------------------------ files/ja/web/css/css_scrollbars/index.md | 96 ++++++++++++++++++++++++++++++ 2 files changed, 96 insertions(+), 96 deletions(-) delete mode 100644 files/ja/web/css/css_scrollbars/index.html create mode 100644 files/ja/web/css/css_scrollbars/index.md (limited to 'files/ja/web') diff --git a/files/ja/web/css/css_scrollbars/index.html b/files/ja/web/css/css_scrollbars/index.html deleted file mode 100644 index 94f0f405f0..0000000000 --- a/files/ja/web/css/css_scrollbars/index.html +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: CSS スクロールバー -slug: Web/CSS/CSS_Scrollbars -tags: - - CSS - - CSS スクロールバー - - Overview - - 概要 -translation_of: Web/CSS/CSS_Scrollbars ---- -
{{CSSRef}}{{SeeCompatTable}}
- -

CSS スクロールバー (CSS Scrollbars) は、2000年に Windows の IE 5.5 で導入され、廃止されたスクロールバーの色のプロパティを標準化するためのものです。

- -

基本的な例

- -

この例では、緑色のトラックと紫色のつまみを持った細いスクロールバーを使用してみました。

- -
-
.scroller {
-  width: 300px;
-  height: 100px;
-  overflow-y: scroll;
-  scrollbar-color: rebeccapurple green;
-  scrollbar-width: thin;
-}
- -

HTML

- -
<div class="scroller">
-Veggies es bonus vobis, proinde vos postulo essum magis kohlrabi
-welsh onion daikon amaranth tatsoi tomatillo melon azuki bean garlic.
-Gumbo beet greens corn soko endive gumbo gourd. Parsley shallot courgette
-tatsoi pea sprouts fava bean collard greens dandelion okra wakame tomato.
-Dandelion cucumber earthnut pea peanut soko zucchini.
-</div>
- -

結果

- -

{{EmbedLiveSample("Example")}}

-
- -

リファレンス

- -

CSS プロパティ

- -
- -
- -

仕様書

- - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName("CSS Scrollbars")}}{{Spec2("CSS Scrollbars")}}初回定義
- -

アクセシビリティの考慮事項

- -

スクロールバーをカスタマイズする場合は、十分なコントラストがあることと、ヒット領域がタッチ入力を使っている人が操作できるだけ大きいかどうかを考慮してください。

- - - -

ブラウザーの互換性

- -

scrollbar-width

- -
{{Compat("css.properties.scrollbar-width")}}
- -

scrollbar-color

- -
{{Compat("css.properties.scrollbar-color")}}
- -

関連情報

- - diff --git a/files/ja/web/css/css_scrollbars/index.md b/files/ja/web/css/css_scrollbars/index.md new file mode 100644 index 0000000000..94f0f405f0 --- /dev/null +++ b/files/ja/web/css/css_scrollbars/index.md @@ -0,0 +1,96 @@ +--- +title: CSS スクロールバー +slug: Web/CSS/CSS_Scrollbars +tags: + - CSS + - CSS スクロールバー + - Overview + - 概要 +translation_of: Web/CSS/CSS_Scrollbars +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

CSS スクロールバー (CSS Scrollbars) は、2000年に Windows の IE 5.5 で導入され、廃止されたスクロールバーの色のプロパティを標準化するためのものです。

+ +

基本的な例

+ +

この例では、緑色のトラックと紫色のつまみを持った細いスクロールバーを使用してみました。

+ +
+
.scroller {
+  width: 300px;
+  height: 100px;
+  overflow-y: scroll;
+  scrollbar-color: rebeccapurple green;
+  scrollbar-width: thin;
+}
+ +

HTML

+ +
<div class="scroller">
+Veggies es bonus vobis, proinde vos postulo essum magis kohlrabi
+welsh onion daikon amaranth tatsoi tomatillo melon azuki bean garlic.
+Gumbo beet greens corn soko endive gumbo gourd. Parsley shallot courgette
+tatsoi pea sprouts fava bean collard greens dandelion okra wakame tomato.
+Dandelion cucumber earthnut pea peanut soko zucchini.
+</div>
+ +

結果

+ +

{{EmbedLiveSample("Example")}}

+
+ +

リファレンス

+ +

CSS プロパティ

+ +
+ +
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("CSS Scrollbars")}}{{Spec2("CSS Scrollbars")}}初回定義
+ +

アクセシビリティの考慮事項

+ +

スクロールバーをカスタマイズする場合は、十分なコントラストがあることと、ヒット領域がタッチ入力を使っている人が操作できるだけ大きいかどうかを考慮してください。

+ + + +

ブラウザーの互換性

+ +

scrollbar-width

+ +
{{Compat("css.properties.scrollbar-width")}}
+ +

scrollbar-color

+ +
{{Compat("css.properties.scrollbar-color")}}
+ +

関連情報

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