html如何使图片移动

html-css024

html如何使图片移动,第1张

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

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

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

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

1、<img src="" hspace="">这里的hspace指水平方向与其他元素的间隔，填个你想要的整数就行了，如果是竖直方向就用vspace，简单吧。

2、<img src="#" width="100" height="100" style=" margin-left:10px" />在图片代码里面加上margin属性。往右移就margin-left，往左移动就margin-right。

3、给图片加个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" />。

4、在table外面套个div，再调整div的位置。

var flag =false

onMouseDown ->flag = true

onMouseUp ->flag = false

onMouseMove ->if (flag == true) 设置图片或div的height、width，或在新的页面打开图片地址