<html>
<head>
<title>File</title>
<style type="text/css">
#infile {visibility: hidden}
input {font-family: Verdanafont-size: 9pt}
</style>
<script language="JavaScript">
function changeName()
{
var f = document.getElementById("filename")
f.value = document.getElementById("infile").value
}
function openFile()
{
document.getElementById("infile").click()
}
</script>
</head>
<body>
<input type="file" id="infile" onChange="changeName()" />
<input type="text" id="filename" size="50" maxlength="50" />
<a href="javascript: openFile()"><img src="***.jpg" border="0" /></a>
</body>
</html>
原理：
点击图片链接时，触发打开文件框，如果file框里的内容改变时，把file框里的内容传到文本框。
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0pxpadding: 0pxlist-style: nonetext-decoration: none}/*通配符，个人习惯*/
#btn{background: url(https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png)width: 540pxheight: 258px}
</style>
</head>
<body>
<h1>button按钮的背景是图片</h1>
<button id="btn"></button>
</body>
</html>
