From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001
From: Peter Bengtsson <mail@peterbe.com>
Date: Tue, 8 Dec 2020 14:40:17 -0500
Subject: initial commit

---
 files/ja/web/css/css_scrollbars/index.html | 98 ++++++++++++++++++++++++++++++
 1 file changed, 98 insertions(+)
 create mode 100644 files/ja/web/css/css_scrollbars/index.html

(limited to 'files/ja/web/css/css_scrollbars')

diff --git a/files/ja/web/css/css_scrollbars/index.html b/files/ja/web/css/css_scrollbars/index.html
new file mode 100644
index 0000000000..50285c8342
--- /dev/null
+++ b/files/ja/web/css/css_scrollbars/index.html
@@ -0,0 +1,98 @@
+---
+title: CSS スクロールバー
+slug: Web/CSS/CSS_Scrollbars
+tags:
+  - CSS
+  - CSS スクロールバー
+  - Overview
+  - 概要
+translation_of: Web/CSS/CSS_Scrollbars
+---
+<div>{{CSSRef}}{{SeeCompatTable}}</div>
+
+<p class="summary"><span class="seoSummary"><ruby><strong>CSS スクロールバー</strong><rp> (</rp><rt>CSS Scrollbars</rt><rp>) </rp></ruby>は、2000年に Windows の IE 5.5 で導入され、廃止されたスクロールバーの色のプロパティを標準化するためのものです。</span></p>
+
+<h2 id="Basic_Example" name="Basic_Example">基本的な例</h2>
+
+<p>この例では、緑色のトラックと紫色のつまみを持った細いスクロールバーを使用してみました。</p>
+
+<div id="Example">
+<pre class="brush:css">.scroller {
+  width: 300px;
+  height: 100px;
+  overflow-y: scroll;
+  scrollbar-color: rebeccapurple green;
+  scrollbar-width: thin;
+}</pre>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div class="scroller"&gt;
+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.
+&lt;/div&gt;</pre>
+
+<h3 id="Result" name="Result">結果</h3>
+
+<p>{{EmbedLiveSample("Example")}}</p>
+</div>
+
+<h2 id="Reference" name="Reference">リファレンス</h2>
+
+<h3 id="CSS_Properties" name="CSS_Properties">CSS プロパティ</h3>
+
+<div class="index">
+<ul>
+ <li>{{CSSxRef("scrollbar-width")}}</li>
+ <li>{{CSSxRef("scrollbar-color")}}</li>
+</ul>
+</div>
+
+<h2 id="Specifications" name="Specifications">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+   <th scope="col">状態</th>
+   <th scope="col">備考</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("CSS Scrollbars")}}</td>
+   <td>{{Spec2("CSS Scrollbars")}}</td>
+   <td>初回定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Accessibility_concerns" name="Accessibility_concerns">アクセシビリティの考慮事項</h2>
+
+<p>スクロールバーをカスタマイズする場合は、十分なコントラストがあることと、ヒット領域がタッチ入力を使っている人が操作できるだけ大きいかどうかを考慮してください。</p>
+
+<ul>
+ <li><a href="http://adrianroselli.com/2019/01/baseline-rules-for-scrollbar-usability.html">Baseline Rules for Scrollbar Usability | Adrian Roselli</a></li>
+</ul>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<h3 id="scrollbar-width">scrollbar-width</h3>
+
+<div>{{Compat("css.properties.scrollbar-width")}}</div>
+
+<h3 id="scrollbar-color">scrollbar-color</h3>
+
+<div>{{Compat("css.properties.scrollbar-color")}}</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li>{{CSSxRef("::-webkit-scrollbar")}}</li>
+ <li>{{CSSxRef("-ms-overflow-style")}}</li>
+</ul>
-- 
cgit v1.2.3-54-g00ecf