我正在使用ASP.NET中的Bootstrap 3,并使用复选框类,但它给我显示了额外的填充或边距(像这样)。
我该如何修复它。
这是示例代码。
<div class="checkbox">
<asp:CheckBox ID="CheckBox1" Text="I accept terms and conditions" runat="server" />
</div>
我正在使用ASP.NET中的Bootstrap 3,并使用复选框类,但它给我显示了额外的填充或边距(像这样)。
我该如何修复它。
这是示例代码。
<div class="checkbox">
<asp:CheckBox ID="CheckBox1" Text="I accept terms and conditions" runat="server" />
</div>
由于您正在使用asp.net服务器端复选框,它具有自己的样式。为了使您的代码保持原样,并且只是想将复选框的布局调整完美,那么您需要编写额外的css来覆盖Bootstrap css。以下是将仅使用css解决您的问题的代码:
Bootstrap复选框代码: .checkbox input[type=checkbox] {margin-left: -20px;}
自定义代码以使复选框靠近文本或标签 .checkbox input[type=checkbox] {margin-left: 0px; // 调整margin-left以调整复选框输入。}
第二种方法是只需从Bootstrap中复制粘贴复选框代码,并在代码中添加runat ="server",如下所示:
<div class="checkbox">
<label>
<input type="checkbox" id="chkbox1" runat="server"> I accept terms and conditions
</label>
</div>
<div class="form-check col-lg-3 col-md-3 col-sm-6 col-xs-12">
<asp:CheckBox ID="CheckBox1" runat="server" Text="I accept terms and conditions" Checked="false" />
</div>