如何解决引导表图标未显示
我正在创建自4.5.2版的引导表(版本1.18)
除了表格图标未显示以外,其他所有东西似乎都正常运行-但是它们所代表的表格控制功能仍在起作用(即打印按钮仍然有效)
我在想我缺少图标的扩展名吗?但值得注意的是,以前的迭代是基于引导程序和引导表DID的先前版本进行的。
下面是我的扩展名导入和我的表格设置,以及两张显示带有工作按钮的mia图标的照片。
<!-- Style sheets -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<!-- JQUERY -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<!-- BOOTSTRAP -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<!-- BOOTSTRAP TABLE EXTENSIONS -->
<link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.18.0/dist/bootstrap-table.min.css">
<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/bootstrap-table.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/filter-control/bootstrap-table-filter-control.css">
<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/filter-control/bootstrap-table-filter-control.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/multiple-sort/bootstrap-table-multiple-sort.js"></script>
<link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/reorder-rows/bootstrap-table-reorder-rows.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/TableDnD/0.9.1/jquery.tablednd.js" integrity="sha256-d3rtug+Hg1GZPB7Y/yTcRixO/wlI78+2m08tosoRn7A=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/reorder-rows/bootstrap-table-reorder-rows.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.18.0/dist/extensions/print/bootstrap-table-print.js"></script>
然后设置表格
<table id="varTable" class="table table-striped table-condensed table-hover table-sm table-responsive mx-auto" style='width: 90%; margin-left: 2%; margin-right: 2%' data-toggle="varTable" data-show-columns="true" data-pagination="true" data-pagination-pre-text="Previous" data-pagination-next-text="Next" data-page-list="[10,25,50,100,all]" data-filter-control="true" data-show-search-clear-button="true" data-show-multi-sort="true" data-sort-priority='[{"sortName":"basic.chr.na"},{"sortName":"basic.pos.ba"}]' data-use-row-attr-func="true" data-reorderable-rows="true" data-show-print="true"> <thead>
解决方法
我遇到了同样的问题。对我来说,解决此问题的方法是手动添加fontawesome样式表。
TMT127
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。