HTML里如何移动图片位置

html-css06

HTML里如何移动图片位置,第1张

1、首先,您需要创建一个html。

2、同时,您需要创建一个CSS文档。

3、CSS文档的后缀名必须为CSS,比如我们创建一个index.css文档。这一点很重要。

4、引入CSS文档。HTML里就可以移动图片位置,方法很简单。

给图片加个class用相对定位做就可以了

例:

<style type="text/css">

.imgPlace{ position:relativetop:5pxleft:5px/*right:5pxbottom:5px*/}

/*position:relative是相对定位的意思top是相对离上面的距离,left是相对离左面的距离,right是相对离右面的距离,bottom是相对离下面的距离,*/

</style>

<img src="...." alt=" " title=" " class="imgPlace" />

需要准备的材料分别有:电脑、浏览器、html编辑器。

1、首先,打开html编辑器,新建html文件,例如:index.html。

2、在index.html中的<body>标签中,输入html代码:<img style="margin-top: 100px" src="small2.png" />。

3、浏览器运行index.html页面,此时图片被向下移动了100px。