1、导入样式,注意顺序 !-- bootstrap样式 --link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css"link rel="stylesheet" href
1、导入样式,注意顺序
<!-- bootstrap样式 --> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="/static/bootstrap-fileinput/css/fileinput.min.css"> <script type="text/javascript" src="/static/jquery-3.2.1/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="/static/bootstrap-fileinput/js/fileinput.min.js"></script> <script type="text/javascript" src="/static/bootstrap-fileinput/js/locales/zh.js"></script> <script type="text/javascript" src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
2、test.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> 测试 </title> <!-- bootstrap样式 --> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="/static/bootstrap-fileinput/css/fileinput.min.css"> <script type="text/javascript" src="/static/jquery-3.2.1/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="/static/bootstrap-fileinput/js/fileinput.min.js"></script> <script type="text/javascript" src="/static/bootstrap-fileinput/js/locales/zh.js"></script> <script type="text/javascript" src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> </head> <body> <div class="container-fluid"> <div class="row"> <!-- 上传文件 --> <div class="col-sm-8 col-md-8"> <div class="panel panel-default"> <input id="f_upload" type="file" class="file" /> </div> </div> </div> </div> </body> </html>
3、效果截图