输入类型文件按钮的造型高度

我试图使用图像对输入类型文件进行样式设置。到目前为止，这么好，但现在我想设置该按钮的高度为40px。问题是，不知何故，这个按钮有一个固定的高度，即使当我把！重要的40px的大小，该按钮仍然显示原始高度。有人可以帮助我吗？谢谢这里是HTML：输入类型文件按钮的造型高度

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 
<HTML> 
    <HEAD> 
    <LINK href="main.css" rel="stylesheet" type="text/css"> 
    </HEAD> 
    <BODY> 
<input type="text" id="fileName" class="file_input_textbox" readonly="readonly"> 

<div class="file_input_div"> 
    <input type="button" value="" class="file_input_button" /> 
    <input type="file" class="file_input_hidden" onchange="javascript: document.getElementById('fileName').value = this.value" /> 
</div>

和CSS：

.file_input_textbox 
{ 
    float: left; 
    background: none repeat scroll 0 0 #FF554B; 
    border: medium none; 
    color: #FFFEFA; 
    font-family: 'InterstateBold'; 
    font-size: 11px; 
    margin: 0; 
    padding: 12px 15px; 
    width: 647px; 
} 

.file_input_div 
{ 
    position: relative; 
    width: 100px; 
    height: 23px; 
    overflow: hidden; 
} 

.file_input_button 
{ 
    position: absolute; 
    top: 0px; 
    background:url(btn-newsletter.jpg) no-repeat; 
    color: #FFFFFF; 
    border-style: none; 
    width:40px; 
    height:40px !important; 
} 

.file_input_button:hover 
{ 

    background:url(btn-newsletter2.jpg) no-repeat !important; 

} 

.file_input_hidden 
{ 
    font-size: 45px; 
    position: absolute; 
    right: 0px; 
    top: 0px; 
    opacity: 0; 

    filter: alpha(opacity=0); 
    -ms-filter: "alpha(opacity=0)"; 
    -khtml-opacity: 0; 
    -moz-opacity: 0; 
}

来源

2011-09-15 Eva Dias

，如果你向我们展示了CSS和HTML –

你可以分享你的代码的样本，使用http://jsfiddle.net/ [样式输入 –

可能重复它可能是更容易帮助您键入=文件不按预期工作]（http://stackoverflow.com/questions/4664220/styling-input-type-file-not-working-as-expected） –

我想我了。作为input type="file"和input type="button"不要让我改变高度，我改变这一行：<input type="button" value="" class="file_input_button" /> 这样：<a href="#" class="file_input_button" />并更改CSS来：

.file_input_div 
{ 
    position: relative; 
    width: 100px; 
    height: 38px; 
    overflow: hidden; 
}

谢谢你，反正。

来源

2011-09-16 08:39:54

然而，正确的CSS语法，无论它是否让你风格的高度或不（我不知道）。是：

input[type=file] { 
    //your style rules 
}

来源

2014-03-26 11:32:43 YVbakker

输入类型文件按钮的造型高度

回答

相关问题