CSS 背景_html/css_WEB-ITnose

まず、すべての要素の背景属性は継承されないことを説明します。背景色はデフォルトで透明になります

{background-color:padding: 20px;}

2. 背景画像

a.radio {background-image: url(/i/eg_bg_07.gif);}

3. ページ上で背景画像をタイル表示する必要がある場合は、 background-repeat 属性を使用できます。

repeat 属性値により、背景画像の場合と同様に、画像が水平方向と垂直方向の両方に並べて表示されます。 repeat-x とrepeat-y を指定すると、画像はそれぞれ水平方向または垂直方向にのみ繰り返されますが、no-repeat を指定すると、画像をどの方向にも並べて表示できなくなります。

デフォルトでは、背景画像は要素の左上隅から始まります。次の例を参照してください:

body {background-image: url(/i/eg_bg_03.gif); background-repeat:repeat-y; }

4. 背景の位置

は、background- を使用して変更できます。 Position 属性 背景内の画像の位置。

次の例では、body 要素内で背景画像を中央に配置します。

background-position プロパティの値を指定するには、さまざまな方法があります。まず、いくつかのキーワード (上、下、左、右、中央) を使用できます。通常、これらのキーワードはペアで表示されますが、常にそうとは限りません。 100px や 5cm などの長さの値を使用することもでき、最後にパーセント値を使用することもできます。値のタイプが異なると、背景画像の配置が若干異なります。

5. 背景の関連付け

文書が比較的長い場合、文書を下にスクロールすると、背景画像も一緒にスクロールします。文書が画像を超えてスクロールされると、画像が消えます。

background-attachment 属性を使用して、このスクロールを防ぐことができます。この属性を使用すると、画像が表示領域に対して固定されているため、スクロールの影響を受けないことを宣言できます。 -繰り返し; 背景添付:修正済み }