diff options
Diffstat (limited to 'files/ja/web/css/-moz-orient/index.html')
| -rw-r--r-- | files/ja/web/css/-moz-orient/index.html | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/files/ja/web/css/-moz-orient/index.html b/files/ja/web/css/-moz-orient/index.html new file mode 100644 index 0000000000..ddd5011f73 --- /dev/null +++ b/files/ja/web/css/-moz-orient/index.html @@ -0,0 +1,81 @@ +--- +title: '-moz-orient' +slug: Web/CSS/-moz-orient +tags: + - CSS + - CSS プロパティ + - Mozilla 拡張 + - Non-standard + - Reference +translation_of: Web/CSS/-moz-orient +--- +<div>{{CSSRef}}{{Non-standard_header}}</div> + +<p><a href="/ja/docs/Web/CSS">CSS</a> の <strong><code>-moz-orient</code></strong> プロパティは、適用される要素の向きを指定します。</p> + +<p>{{cssinfo}}</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<p><code>-moz-orient</code> プロパティは、以下の一覧にあるキーワード値のうちの一つで指定します。</p> + +<h3 id="Values" name="Values">値</h3> + +<dl> + <dt><code>inline</code></dt> + <dd>要素をテキストの軸と同じ方向に描画します。横書きモードでは水平方向に、縦書きモードでは垂直方向に描画します。</dd> + <dt><code>block</code></dt> + <dd>要素をテキストの軸と直交するように描画します。横書きモードでは垂直方向に、縦書きモードでは水平方向に描画します。</dd> + <dt><code>horizontal</code></dt> + <dd>要素が水平方向に描画される</dd> + <dt><code>vertical</code></dt> + <dd>要素が垂直方向に描画される</dd> +</dl> + +<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: 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></pre> + +<h3 id="CSS">CSS</h3> + +<pre class="brush: css">.vert { + -moz-orient: vertical; + width: 16px; + height: 150px; +}</pre> + +<h3 id="Result" name="Result">結果</h3> + +<p>{{EmbedLiveSample("Examples","200","360")}}</p> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<p>W3C に<a href="https://lists.w3.org/Archives/Public/www-style/2014Jun/0396.html">提出</a>され、最初の反応は肯定的でしたが、このプロパティはまだ仕様書には含まれていません。今のところ、 Mozilla 独自の拡張 (つまり、 <code>-moz-orient</code>) です。</p> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2> + +<p class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</p> + +<p>{{Compat("css.properties.-moz-orient")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{cssxref("box-orient")}}</li> +</ul> |