怎样用CSS +DIV将第二张特定图片覆盖第一张图片的部分区域?

html-css023

怎样用CSS +DIV将第二张特定图片覆盖第一张图片的部分区域?,第1张

用CSS +DIV将第二张特定图片覆盖第一张图片的部分区域方法:

用CSS中元素的background : background-color || background-image || background-repeat || background-attachment || background-position。 示例代码如下:

复制代码代码如下:

background:transparent url(123.jpg) no-repeat scroll -140px -20px 

解释: 

transparent表示透明无颜色 

url(123.jpg) 表示背景图片

no-repeat 表示图片不重复

scroll 表示背景图片随浏览器下拉而滚动

-140px 表示水平位置在图片的-140px处(以图片的左上角为0,0)

-20px 表示垂直位置在图片的-20px处(以图片的左上角为0,0)

div覆盖着另一个div,是因为其中一个或者两个脱离了文档流。常见脱离文档流主要原因有:

div浮动造成,常用解决方法是清除浮动

div受到相对定位或者绝对定位的影响,定位是可以设置left,right,bottom,top,等位置样式的,解决方法一般是清除定位,或者解决兼容性,合理控制left,right ,bottom,top四个属性的值。

另外还有一种不常见的情况,例如margin的负数值,可以造成div偏离原来的位置,建议合理设置即可。