c# - 如何更改 asp.net 复选框/单选按钮 css 并正确运行 atserver

Question

我正在使用 Bootstrap Sass 模板 Shards Template用于开发 ASP.NET(C#) Web 应用程序。我的复选框/单选按钮有问题，CSS 已实现，但是当我添加 runat="server" 属性时，复选框在单击后不会更改 CSS。

<div class="custom-control custom-checkbox mb-1">
  <input type="checkbox" class="custom-control-input" id="formsCheckboxDefault">
  <label class="custom-control-label" for="formsCheckboxDefault">Default</label>
</div>

这行得通，但是当像下面这样添加 runat=server 时它行不通

<div class="custom-control custom-checkbox mb-1">
  <input type="checkbox" class="custom-control-input" id="formsCheckboxDefault" runat="server"/>
  <label class="custom-control-label" for="formsCheckboxDefault">Default</label>
</div>

它显示复选框，但在单击时不会改变。我怎样才能解决这个问题？ 这是谷歌开发者工具的屏幕截图(右键单击 -> 在新窗口中打开以仔细查看):-

Answer 1

为了使用 ASP.NET webforms 运行您的示例，您需要将复选框包装在 <form runat="server"> 中。 .

<form runat="server">
 <div class="custom-control custom-checkbox mb-1">
 <input type="checkbox" class="custom-control-input" id="formsCheckboxDefault2" runat="server"/>
 <label class="custom-control-label" for="formsCheckboxDefault2">Default4</label>
 </div>
</form>

<asp:checkbox>不能使用，因为 ASP.NET webforms 呈现额外的 <span> <input>周围.因此，bootstrap 的 CSS 不再起作用。

请注意，Stackoverflow 的运行代码片段功能不支持 ASP.NET 网络表单。这就是为什么您的问题对于普通 stackoverflow 用户来说NOT 是可重现的。您的问题只能在 ASP.NET-webform-projects 中的 Visual Studio 中看到。