在网页制作中,如果用到background,常常会遇到0 0 no-repeat的情况,那么,0 0 no-repeat到底是什么意思呢?下面将为你详细介绍。
一、语法及使用说明
定义和用法
background-repeat 属性设置是否及如何重复背景图像。
默认地,背景图像在水平和垂直方向上重复。
详细说明
background-repeat 属性定义了图像的平铺模式。
从原图像开始重复,原图像由 background-image 定义,并根据 background-position 的值放置。
默认值: repeat
继承性: no
版本: CSS1
JavaScript 语法: object.style.backgroundRepeat="repeat-y"
repeat 默认。背景图像将在垂直方向和水平方向重复。
repeat-x 背景图像将在水平方向重复。
repeat-y 背景图像将在垂直方向重复。
no-repeat 背景图像将仅显示一次。
inherit 规定应该从父元素继承 background-repeat 属性的设置。
二、使用范例
范例1
.logon_btn{
background:url(../images/btn_logon.png) 0 0 no-repeat;
width:246px;
height:43px;
display:block;
}
上面的CSS代码中,0 0 no-repeat;其中0 0代表background-position的值,表示背景图的定位,前后两个分别是横向定位和纵向定位。
左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。
如果您仅规定了一个值,另一个值将是50%。
简单的讲,0 0 就是说背景图片在标签中的显示位置,水平x位置为0,垂直y位置为0,就是说位置在左上角。
范例2
.logon{
background-image:
url(/img/123.gif);
background-repeat: repeat-y
}