我正在尝试使用由 css 创建的按钮更改默认输入类型 =“文件”按钮。这是我的html代码:
<input type="file" name="name" value="" />
<a href="#" class="button">Browse</a>
...这是我的 CSS 按钮代码:
.button {
display:inline;
-moz-box-shadow:inset 0px 1px 0px 0px #fff6af;
-webkit-box-shadow:inset 0px 1px 0px 0px #fff6af;
box-shadow:inset 0px 1px 0px 0px #fff6af;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #f3b415) );
background:-moz-linear-gradient( center top, #ffec64 5%, #f3b415 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#f3b415');
background-color:#ffec64;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #f3b415;
display:inline-block;
color:#333333;
font-family:arial;
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-shadow:1px 1px 0px #ffee66;
}
.button:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f3b415), color-stop(1, #ffec64) );
background:-moz-linear-gradient( center top, #f3b415 5%, #ffec64 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3b415', endColorstr='#ffec64');
background-color:#f3b415;
}
.button:active {
position:relative;
top:1px;
}
另外,你可以在这里查看