700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html 两张背景图重叠 html 多张背景图片并存

html 两张背景图重叠 html 多张背景图片并存

时间:2023-10-22 07:31:32

相关推荐

html 两张背景图重叠 html 多张背景图片并存

我们在制作网页的时候,一般一个DIV放一张图片进去。但是如果放多张呢?答案是可以的,但是就目前浏览器来说只有FF和C支持,IE不支持。

div{

background: url("right.png") top left no-repeat, url(error.png) bottom left no-repeat;//注意这个必须写在一起,有多少张图片,就写多少。每个url后面的top bottom left right 位置是对该背景图片的一个定位。但是只是大概的定位,不能进行精确定位。

width: 1000px;

height: 1000px;

border: 1px solid #000000;

background-size:100px 200px;//这个是对所有的背景图片尺寸进行控制的,注意是所有的背景图片

background-position:8px 95px; //对图片所在DIV的位置进行控制,也是所有的背景图片

}

但是如果放入多张怎么才能对这些放入的图片单个精确定位呢?看下面的CSS代码。

div{

border: 1px solid #000000;

background:url("right.png") 0px 0px no-repeat,url("error.png") 0px 300px no-repeat;//前面 所说的url后面的定位是模糊的,不精确的。可以直接在url后面跟上像素,这个可以指定每个背景图片所在div的准确位置。第一个位置是离上边距的距离;第二个距离是离左边距的距离。

height: 800px;

width: 1000px;

}

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