如何在html页面中将img src移动几个像素

时间:2014-07-24 01:57:27

标签: html css

我找到了一种方法来制作我自己的自定义文件上传控件,通过在其上放置一个假控件,当我点击假的时,我实际上是在下面的实际控件上。

无论如何,浏览按钮的图像有点偏高。

我怎样才能降低它?

这是js小提琴。

JsFiddle

这是html和css:

    <div>
    <div class="fileinputs">
        <input type="file" class="file" />
        <div class="fakefile">
            <input />
            <img src="search.jpg" />
        </div>
    </div>
</div>

div.fileinputs {
position: relative;
}
div.fakefile {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
}
input.file {
position: relative;
text-align: right;
-moz-opacity:0;
filter:alpha(opacity: 0);
opacity: 0;
z-index: 2;
}

1 个答案:

答案 0 :(得分:17)

我相信这就是你要找的东西。 jsFiddle

<强> CSS

.moveimage
{
    position: relative;
    top: 3px;
}

修改后的HTML

<img class="moveimage" src="search.jpg" />