ASP.NET 自定义复选框 CSS，无需 JavaScript / Checkbox css personalizado sin javascript

引言

有一种方法可以使用纯 CSS 自定义复选框，而无需 JavaScript。

使用代码

一个 Asp:Checkbox 由一个标签和一个 input type="checkbox" 组成（在 HTML 中）。因此，您需要在 CSS 中使用一个加号 (+) 选择器。

 

input[type=checkbox] { display:none; } /*first hide check control*/

input[type=checkbox] + label:before { /*using font awesome for icons.*/
font-family: FontAwesome;
display: inline-block;
}

input[type=checkbox] + label:before { content: "\f096"; } /* icon when uncheck*/

input[type=checkbox]:checked + label:before { content: "\f046"; } /* icon when check*/

就这样。您可以先放置类名（例如 .myCheck input[type=checkbox]...............）来使用 CSS 类，然后在 CssClass 属性中使用它。

您必须拥有此字体才能使用它。您也可以使用图像图标，只需更改 content 属性，它可以是您想要的任何内容。