1.背景属性 1.1基本属性 口 background- repeat background- repeat属性决定当背景图像比元素的空间小时将如何 排列。 该属性的默认值为 repeat,这将让图像在水平和垂直两个方向上平 铺。当该属性取值为 repeat-x时,背景图像将仅在水平上平铺。当 该属性取值为 repeat-y时,背景图像将仅在垂直方向上平铺。当该 属性取值为no- repeat时,背景图像将不会平铺。 pbackground-image url(img. gif), background-repeatrepeat-x titleup(background-image url(img gif), background-repeat repeat-y, body ( background-image url(img. gif), background-repeat no-repeat 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.背景属性 background-repeat background-repeat属性决定当背景图像比元素的空间小时将如何 排列。 该属性的默认值为repeat，这将让图像在水平和垂直两个方向上平 铺。当该属性取值为repeat-x时，背景图像将仅在水平上平铺。当 该属性取值为repeat-y时，背景图像将仅在垂直方向上平铺。当该 属性取值为no-repeat时，背景图像将不会平铺。 6 1.1基本属性
1.背景属性 1.1基本属性 a background-attachment background- attachment属性决定背景图像在元素的内容进行相应 滚动时是应该滚动还是应该停留在屏幕的一个固定位置。 这个属性的默认值取值为scro1l。当取值为 fixed时,可实现水印 效果,这和body>元素的专有属性 properties(由 Microsoft引 入)相似。 body background-image url (images/logo. png), background-attachmentfixed 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.背景属性 background-attachment background-attachment属性决定背景图像在元素的内容进行相应 滚动时是应该滚动还是应该停留在屏幕的一个固定位置。 这个属性的默认值取值为scroll。当取值为fixed时，可实现水印 效果，这和<body>元素的专有属性bgproperties（由Microsoft引 入）相似。 7 1.1基本属性
8 1.背景属性 1.1基本属性 a background-position ■ background- position属性指定背景图像,在元素的画布空间中的 定位方式 有三种方法指定位置 口为图像的左上角指定一个绝对距离,通常以像素为单位。 口可以使用水平和垂直方向的百分比来指定位置。 口可以使用关键字来描述水平和垂直方向的位置。水平方向上的关键字 为left、 center和 right。垂直方向上的关键字为top、 center:和 bot tom。在使用关键字时,未指明的方向上默认的取值为 center。 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.背景属性 background-position background-position属性指定背景图像，在元素的画布空间中的 定位方式。 有三种方法指定位置： 为图像的左上角指定一个绝对距离，通常以像素为单位。 可以使用水平和垂直方向的百分比来指定位置。 可以使用关键字来描述水平和垂直方向的位置。水平方向上的关键字 为left、center和right。垂直方向上的关键字为top、center和 bottom。在使用关键字时，未指明的方向上默认的取值为center。 8 1.1基本属性
9 1.背景属性 1.1基本属性 表1102背景位关字定位方式 匚关 水平位置 垂直位置 50% 100% 0% center left 0% 50% center center 50% centerr型 50% bottom left 0 bottom center% 100% bottom right 100% 1009 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.背景属性 9 1.1基本属性
10 1.背景属性 1.1基本属性 a background-position ■具体语法如下 plbackground-image url(mg. gif), background-position: 10px 10px) pf background-image url( img.gif), background-position. 20%20%] body background-image url(img. gif), background-position: center center) 注意:如果仅仅设置了一个关键字,那么第二个关键字将取默认值 center。因此,在上面的例子 中,关键字 center只需用一次即可。 河南中医学院/阮晓龙713938213680/http://web.51xueweb.cn
河南中医学院 / 阮晓龙 / 13938213680 / http://web.51xueweb.cn 1.背景属性 10 1.1基本属性 background-position 具体语法如下： 注意：如果仅仅设置了一个关键字，那么第二个关键字将取默认值center。因此，在上面的例子 中，关键字center只需用一次即可