背景

UK[ˈbækgraʊnd] US[ˈbækˌɡraʊnd]

n. (絵画など) 背景; 背景色; 背景情報; サウンドトラック

複数形: 背景

position

## English[pəˈzɪʃn] US[pəˈzɪʃən]

n. 位置、方向、状態、位置、態度、位置、方向。 State

vt. 置く; 置く...適切な位置; 位置...; 軍隊を配置する

三人称単数: 位置 複数: 位置 現在分詞: 位置する 過去形: 位置する過去分詞: 位置

cssの背景位置プロパティ 構文

background-position 属性の使用方法

background-position プロパティは、背景画像の開始位置を設定できます。構文は次のとおりです:background-position: x y、x は水平位置を表し、y は垂直位置を表します。x と y に値を割り当てる方法は多数あります (例: 左上、3% 2%、xpos ypos) 。

機能: 背景画像の開始位置を設定します。

説明: この属性は、元の背景画像 (background-image で定義) の位置を設定します。背景画像を繰り返す場合は、この位置から開始されます。

注: background-attachment プロパティが Firefox と Opera で適切に動作するようにするには、このプロパティを「fixed」に設定する必要があります。

設定できる値:

xpos ypos

cssの背景位置プロパティ 例

<html>
<head>
<style type="text/css">
body
{ 
  background-image:url('http://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg');
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-position:center;
}
</style>
</head>

<body>
<body>
<p><b>提示：</b>您需要把 background-attachment 属性设置为 "fixed"，才能保证该属性在 Firefox 和 Opera 中正常工作。</p>
</body>
</body>
</html>

インスタンスの実行 »

[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します

ValueDescription

左上

中央上

右上

中央左

中央中央

中央右

左下

中央下

右下

キーワードを 1 つだけ指定した場合、2 番目の値は「 center」になります。 」。

デフォルト値: 0% 0%。

x% y%

最初の値は水平位置、2 番目の値は垂直位置です。

左上隅は 0% 0% です。右下隅は 100% 100% です。

値を 1 つだけ指定した場合、もう 1 つの値は 50% になります。


最初の値は水平位置、2 番目の値は垂直位置です。

左上隅は 0 0 です。単位はピクセル (0px 0px) またはその他の CSS 単位です。

値を 1 つだけ指定した場合、もう 1 つの値は 50% になります。

% と位置の値を混合できます。