Css样式--背景样式详解

2024-07-11 08:28:19

字体：大中小

来源：转载

供稿：网友

背景：

1.背景属性都不能继承

2.背景色：其默认值是 transparent。transparent 有“透明”之意 h1 {background-color: #00ff00}

3.背景图像：背景重复背景定位

复制代码

代码如下:
p.flower {background-image: url(/i/eg_bg_03.gif); padding: 20px;background-repeat: repeat-y;<code>background-position:center;</code>}

背景重复：repeat-x 和 repeat-y 分别导致图像只在水平或垂直方向上重复，no-repeat 则不允许图像在任何方向上平铺。

背景定位：为 background-position 属性提供值有很多方法。首先，可以使用一些关键字：top、bottom、left、right 和 center。通常，这些关键字会成对出现，不过也不总是这样。还可以使用长度值，如 100px 或 5cm，最后也可以使用百分数值。不同类型的值对于背景图像的放置稍有差异。

4.关键字

图像放置关键字最容易理解，其作用如其名称所表明的。例如，top right 使图像放置在元素内边距区的右上角。

根据规范，位置关键字可以按任何顺序出现，只要保证不超过两个关键字 - 一个对应水平方向，另一个对应垂直方向。

如果只出现一个关键字，则认为另一个关键字是 center。

所以，如果希望每个段落的中部上方出现一个图像，只需声明如下：

复制代码

代码如下:
p
{
background-image:url('bgimg.gif');
background-repeat:no-repeat;
background-position:top;
}

下面是等价的位置关键字：