html怎么使多个img是叠加方式存在

html怎么使多个img是叠加方式存在,第1张

多个img叠加用css样式控制即可:

如果是背景的话,background 属性可以指定多个图片。

示例如下:

background: url("haoroomsCSS1_s.jpg") 0 0 no-repeat,

url("haoroomsCSS2_s.jpg") 200px 0 no-repeat

就同时指定了两个图片,两个图片的位置可以通过后面的 位置参数调整。

如果是img元素,可以通过给img指定绝对定位的样式,通过绝对定位让两个img按照

要求的方式重叠。

比如:

img#id1 {position:absolutetop:0left:0width:100%display:block}

mg#id2 {position:absolutetop:20pxleft:0width:100%display:block}

如果要使用绝对定位,img的父元素的样式需要加上 position:relative

如果B不想用背景图,那么就把他们两个放到一个容器中(box),然后给这个容器(box,也就是A和B的父元素)设置 position:relative属性

然后A和B都设置position:absolute属性

再给他们分别设置z-index属性,z-index:数字,数字越大越在上面

希望能帮到你


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7202675.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-02
下一篇 2023-04-02

发表评论

登录后才能评论

评论列表(0条)

保存