Question

首次使用此组件，我希望将搜索输入框设为全宽。

实现这一目标的最佳方法是什么？它是纯CSS还是脚本中有选项？

这是我当前生成表

的脚本

   initializeBootstrapTable() {
            let $table = jQuery(this.$refs.table);

            jQuery.fn.bootstrapTable.columnDefaults.formatter = function(value, row, index) {
                if(typeof(value) === 'boolean') {
                    return value ? 'Yes' : 'No';
                }

                if(value === 'ug') {
                    return 'UG';
                }

                if(value === 'pg') {
                    return 'PG';
                }

                return value;
            };

            $table.bootstrapTable({
                data: this.applicants,
                showColumns: true,
                toolbarAlign: 'right',
                buttonsAlign: 'right',
                pagination: true,
                search: true,
                iconsPrefix: 'fa',
                icons: {
                    paginationSwitchDown: 'fa-collapse-down icon-chevron-down',
                    paginationSwitchUp: 'fa-collapse-up icon-chevron-up',
                    refresh: 'fa-refresh icon-refresh',
                    toggle: 'fa-list-alt icon-list-alt',
                    columns: 'fa-th icon-th',
                    detailOpen: 'fa-plus icon-plus',
                    detailClose: 'fa-minus icon-minus'
                }
            });

            $table.on('click-row.bs.table', (e, row) => this.handleApplicantSelection(row));
        }

谢谢！

Answer 1

似乎没有选择移除浮动，它可以选择向左或向右看选项。相反，添加BS4没有浮动类。 JS是一个很好的方法。

香草：

var d = document.getElementById("my-search");
d.className += " float-none";

的jQuery

$("#my-search").addClass('float-none');

纯CSS

#my-search {
  float:none;
}

如果必须，您也可以使用!important规则。

搜索全宽的最佳方法

1 个答案: