我正在尝试将文件输入按钮设置为看起来像此处的添加文件按钮:
http://blueimp.github.io/jQuery-File-Upload/index.html
我尝试添加 twitter bootstrap btn-success bt-lg css 并设置输入文件按钮 opacity:0
我很难让输入按钮的大小与 blueimp 网站上的输入按钮完全相同:
按钮太大,我无法调整高度/宽度。
我应用了 twitter btn-lg css 并认为它会处理大小。
所有其他按钮的大小可以为 btn-lg css escept 输入按钮。
我的CSS是:
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/base/jquery-ui.css" id="theme">
<link rel="stylesheet" href="/Scripts/css/bootstrap.min.css" />
<style>
#fileadd{
opacity:0;
}
我尝试直接在页面上添加 Twitter bt-lg 类的 css
#btnfile {
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 6px;
}
这是输入按钮:
<div class="fileupload-buttonbar">
<label id="btnfile"class="btn btn-success btn-lg fileinput-button">
<span>Add files...</span>
<input id="fileadd" type="file" name="files[]" multiple>
</label>
@* <span id="uploadbtn" class="btn btn-success">
<i class="glyphicon glyphicon-plus"></i>
<span>Add files...</span>
<input id="file" type="file" name="files[]" multiple>
</span>*@
<button class="btn-primary btn-lg" type="submit">Start upload</button>
<button type="reset" class="btn-warning btn-lg">Cancel upload</button>
<button type="button" class="btn-danger btn-lg">Delete files</button>
</div>