如何在html中把一个图片或者表格覆盖在一张已有图片上的任意位置

html-css031

如何在html中把一个图片或者表格覆盖在一张已有图片上的任意位置,第1张

<div style="position:relative">

<img src="" width="500" height="500" />

<div style="position:absoluteleft:80pxtop:50pxborder:#000 solid 1px"><img src="" width="50" height="50"/></div>

</div>

你可以用里面的LEFT,TOP属性控制他的位置

1、新建一个html文件,命名为test.html。

2、在test.html文件内,使用div标签创建图层1,同时设置div的class为div1,主要用于下面通过该class来设置css样式。

3、在test.html文件内,再使用div标签创建图层2,同时设置div的class为div2。

4、在css标签内,对页面的div元素进行样式统一设置,定义它们的宽度和高度都为250px。

5、在css标签内,对类名div1的div(图层1)进行样式设置,使用position设置div为相对定位,使用background设置div背景颜色为红色,使用z-index设置div层级为1。

6、在浏览器打开test.html文件,查看实现的效果。

实现的方法和详细的操作步骤如下:

1、第一步,打开操作软件并使用DW定义内部CSS样式,见下图,然后进入下一步。

2、其次,完成上述步骤后,看一下背景图片的效果,见下图,然后进入下一步。

3、接着,完成上述步骤后,将img添加到div并输入以下代码,见下图,然后进入下一步。

4、最后,完成上述步骤后,就获得了想要的结果了,如下图所示。这样,问题就解决了。