900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > css 背景颜色 background属性

css 背景颜色 background属性

时间:2022-12-05 08:39:51

相关推荐

css 背景颜色 background属性

背景颜色 background

含义:

背景是指在盒子结构中,衬托在边框线范围以内的背景颜色或背景图。

可以设置背景颜色,或背景图,或同时设置。其中背景图有多项参数可设置。

主要的背景属性设置有:

设置背景颜色:

background-color:yellow;

设置背景图:

background-image:url(图片路径); //注意,图片路径是相对于当前网页或css文件(对外部样式来说)

设置背景图的位置(有背景图的前提下有效)

background-position:水平位置 [,垂直位置];

说明:

①,如果不设置该属性,默认值为“0,0”,即在盒子的左上角。

②,可以设置1个值或2个值;设置1个值的时候,第二个默认为center(居中)。

③,水平位置:可以设置为长度值,或百分比,或以下固定值:left/center/right。

④,垂直位置:可以设置为长度值,或百分比,或以下固定值:/top/center/bottom

设置背景图是否重复(有背景图的前提下有效):

background-repeat:属性值1 [,属性值2];//有以下几个属性值可用:

repeat: 重复,默认值;

no-repeat: 不重复;

repeat-x: 只在x方向重复;

repeat-y: 只在y方向重复;

background:yellow; //只设置背景颜色;​background:yellow url(./images/bg.jpg) no-repeat;​background:yellow url(./images/bg.jpg) repeat-y lelft top;​background:yellow url(‘/images.bg.jpg) repeat no-repeat 5px 10px;​

背景综合属性background:

可以同时设置上述几个有关背景的属性,相互之间用空格隔开,比如:

​background:yellow url(‘/images.bg.jpg) repeat no-repeat 5px 10px;​background:yellow; // 只设置背景颜色;​background:yellow url(./images/bg.jpg) no-repeat;​background:yellow url(./images/bg.jpg) repeat-y lelft top;​background:yellow url(‘/images.bg.jpg) repeat no-repeat 5px 10px;

background:yellow; //只设置背景颜色;​background:yellow url(./images/bg.jpg) no-repeat;​background:yellow url(./images/bg.jpg) repeat-y lelft top;​background:yellow url(‘/images.bg.jpg) repeat no-repeat 5px 10px;​

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。