java no-repeat_CSS中关于background样式repeat与no-repeat的示例代码

CSS中关于background样式repeat与no-repeat的示例代码

New Document

div{

width:400px;

height:200px;

padding:8px;

border:1px solid #96c2f1;

}

1.repeat-x url(zf.jpg);

2.repeat-y url(zf.jpg);

3.repeat-x 0px 50px url(zf.jpg);

4.repeat 25px 25px url(zf.jpg);

5.repeat-x bottom url(zf.jpg);

6.repeat-x left url(zf.jpg);

7.no-repeat url(zf.jpg);

8.no-repeat top url(zf.jpg);

9.no-repeat left url(zf.jpg);

10.no-repeat left 100px url(zf.jpg);靠左边，则左为0，x坐标取0，只写上下

11.no-repeat right 100px url(zf.jpg);靠左边，则左为0，x坐标取0，只写上下

12.no-repeat 100px bottom url(zf.jpg);靠下(代表上下)，所以只用写左右，100px

13.no-repeat -50px 50px url(zf.jpg);距离左边-50px，上边50px

14.no-repeat -50px 距离左边-50px，上下默认，居中

15.no-repeat -50px top = no-repeat -50px 0px (距离div边界左边-50，上边0px)

16.no-repeat left top (靠左上，=(0px，0px),=只有no-repeat