更改引导表单元格中复选框的大小答案

【问题标题】：Change size of checkboxes in cells of bootstrap-table更改引导表单元格中复选框的大小
【发布时间】：2023-03-03 05:58:24
【问题描述】：

我使用bootstrap-table 和column with checkboxes。如何更改复选框的大小。在我的code 中，我想要复选框大小为 25x25，但是当我使用高度和宽度 css 属性时它不起作用。

html

<table class="table table-striped table-bordered table-hover"  cellspacing="0" id="mainTable" data-click-to-select="true" data-show-toggle="true" data-show-columns="true" data-search="true" data-pagination="true">
    <thead>
    <tr>
        <th data-field="state" data-checkbox="true" data-formatter="starsFormatter"></th>
        <th data-field="name" data-halign="center" data-align="left" data-sortable="true">Name</th>
        <th data-field="stargazers_count" data-formatter="starsFormatter" data-halign="center" data-align="left" data-sortable="true">Stars</th>
        <th data-field="forks_count" data-formatter="forksFormatter" data-halign="center" data-align="left" data-sortable="true">Forks</th>
        <th data-field="description" data-halign="center" data-align="left" data-sortable="true">Description</th>
    </tr>
    </thead>
</table>

javascript

var data = [{name: 'ala', stargazers_count: 234, forks_count: 234, description: "asdasdas"},
           {name: 'ala', stargazers_count: 234, forks_count: 234, description: "asdasdas"},
           {name: 'ala', stargazers_count: 234, forks_count: 234, description: "asdasdas"}]

$('table').bootstrapTable({
    data: data
});

function starsFormatter(row, value, inde) {
    return row + '<i class="glyphicon glyphicon-star"></i> ';
}

function forksFormatter(value) {
    return '<i class="glyphicon glyphicon-cutlery"></i> ' + value;
}

css

.bs-checkbox input{
    height: 25px;
    width: 25px;
}

【问题讨论】：

尝试使用!important强制样式：{ width:25px!important; height:25px!imporant; }
@Zealander 我试过了，但没有用。
当我测试它时它工作正常；您可能应该在片段中发布问题的工作示例。
@vanburenx 这里是 sn-p jsfiddle.net/3L7vgcx0/106
这适用于 IE 和 Chrome，不适用于 Firefox。这是一个已知问题：stackoverflow.com/questions/306924/…

标签： jquery css twitter-bootstrap twitter-bootstrap-3 bootstrap-table

【解决方案1】：

简单易行的方法

input[type="checkbox"]{
transform:scale(x,y);
}

x,y 可以是任何值，具体取决于您想要多大的盒子

【讨论】：

【解决方案2】：

.bs-checkbox input
{
    zoom:2;
}

【讨论】：