HTML：
<div> <img src="some/path/" class="thumbnail" /> <input type="file" class="image_upload" /> </div>
CSS：
div
{
border: 2px solid #ccc;
width: 50px;
height: 50px;
overflow: hidden;
}
.thumbnail
{
width: 100%;
}
.image_upload
{
opacity: 0;
position: absolute;
}
我想< img>和< input type =“file”>彼此重叠,并填写他们的父母< div>.我如何修复我的CSS来实现这一目标？
解决方法
无法更改文件输入的大小.你可以
redesign the file-input and,但是可点击区域的大小是不可修改的.
编辑：Aaron显示了第一个技巧,我添加了第二个技巧,所以请参阅this fiddle,其中整个图像可以单击进行文件输入.
诀窍是将font-size设置为较大的值,然后将opacity设置为零,最后将overflow：hidden添加到父元素.
