CSS_html/css_WEB-ITnoseでのbackground-positionの使用

1. 背景位置を指定した場合の同等の書き込み

1. 左上、左上は 0% 0% に相当します。

2. 上、中央上、中央上は 50% 0 % に相当します。 .

3. 右上、右上は 100% 0% に相当します。

4. 左、中央左は 0% 50% に相当します。

5. 中央、中央は 50% に相当します。 50%。

6.右、右中央、中央右は 100% 50% に相当します。

7.左下、左下は 0% 100% に相当します。

8.下、中央下、中央下は 50% 100% に相当します。

9. 右下は 100% 100% に相当します。

2. 背景画像を配置するときに明確にする必要があるいくつかの点

1. 2 つの値のうちの 1 つ目は水平位置であり、これを X 軸位置と呼びます。後者の値は縦方向の位置であり、これを y 軸の位置と呼びます。

値が 1 つしかない場合、デフォルトは x 軸方向です

このとき、y 軸方向はデフォルトで上下に揃えられ、中央になります。

2. 座標軸の原点は、対応するコンテナの左頂点です。

3. この座標の y 軸の矢印は下を向いています。つまり、右下隅 (コンテナー内) の x と y の値はすべて正です。

4. x 値と y 値はそれぞれ、座標原点を基準とした背景画像の左頂点 (つまり、コンテナーの左頂点) の値を表します。

5. x y の値はパーセントまたはピクセルで表すことができます。

6. 座標ルールの代わりに配置ルールが適用されます。

x が左の場合、画像の左側がコンテナの左側に揃うことを意味します。右の場合、画像の右側がコンテナの右側に揃うことを意味します。 y が上部の場合、画像の上部がコンテナーの上部と整列していることを意味します。

が下部の場合、x y が中心に等しい場合、画像の下部がコンテナーの下部と整列していることを意味します。 、それは中央にあることを意味します。

7. x y がパーセントまたはピクセルで表される場合、その値は負の数になる可能性があります。座標規則を適用すると、負の数の意味を簡単に理解できます。x が負の数の場合、y が負の数の場合、画像の左頂点がコンテナの左頂点の左側にあることを意味します。これは、ピクチャの左頂点がコンテナの左固定点の上にあることを意味します。つまり、コンテナの範囲を超えて左上にあります。

参考：background-positionの使用 http://www.studyofnet.com/news/960.html