Jquery ui 如何将Twitter bt lg css类应用于文件浏览输入按钮
我正在尝试将文件输入按钮的样式设置为与此处的“添加文件”按钮类似: 我尝试添加twitter引导btn success bt lg css并设置输入文件按钮不透明度:0 我很难获得与blueimp网站上的输入按钮相同大小的输入按钮: 按钮太大了,我无法调整高度/宽度 我应用了twitterbtnlgcss,并认为这将解决大小问题 所有其他按钮的大小可与输入按钮的btn lg css escept相同 我的css是:Jquery ui 如何将Twitter bt lg css类应用于文件浏览输入按钮,jquery-ui,twitter-bootstrap,Jquery Ui,Twitter Bootstrap,我正在尝试将文件输入按钮的样式设置为与此处的“添加文件”按钮类似: 我尝试添加twitter引导btn success bt lg css并设置输入文件按钮不透明度:0 我很难获得与blueimp网站上的输入按钮相同大小的输入按钮: 按钮太大了,我无法调整高度/宽度 我应用了twitterbtnlgcss,并认为这将解决大小问题 所有其他按钮的大小可与输入按钮的btn lg css escept相同 我的css是: <link rel="stylesheet" href="http://
<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;
}
这是输入按钮:
<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>
添加文件。。。
@*
添加文件。。。
*@
开始上传
取消上传
删除文件
您不能只更改文件输入的不透明度,它仍然会占用所有默认空间,我只需从blueimp插件复制样式:
#btnfile {
position: relative;
}
#fileadd {
position: absolute;
top: 0;
right: 0;
margin: 0;
opacity: 0;
filter: alpha(opacity=0);
transform: translate(-300px, 0) scale(4);
font-size: 23px;
direction: ltr;
cursor: pointer;
}
#btnfile {
position: relative;
}
#fileadd {
position: absolute;
top: 0;
right: 0;
margin: 0;
opacity: 0;
filter: alpha(opacity=0);
transform: translate(-300px, 0) scale(4);
font-size: 23px;
direction: ltr;
cursor: pointer;
}