自定义复选框样式
创始人
2025-07-09 12:44:07
0次

input[type="checkbox"] {
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
-ms-appearance:none;
-o-appearance:none;
width:14px;
height:14px;
border:1px solid #999;
border-radius:2px;
line-height:14px;
text-align:center;
}

input[type="checkbox"]:checked {
background:#BF040E;
border:none;
}

input[type="checkbox"]:checked:after {
content:"\2713";
color:#FFF;
}

<div style="display:flex;align-items:center">
<input name="Checkbox" type="checkbox"> 
<label>&nbsp;自动登录</label>
</div>

效果如下：

image.png

image.png

注意：content属性值要用引号引起来。

上一篇：php的安装与配置

下一篇：弹性布局

相关内容

热门资讯

修复：npm : 无法加载文件... 这个错误是由于 PowerShell 的执行策略限制导致的。在某些系统上，默认情况下，PowerSh...
html的data url和b... data urldata url的语法为：data:[][;base64],说明：（1）mediat...
弹性布局 布局的传统解决方案，基于盒状模型，依赖display属性+position属性+float属性。20...
xml cdata 所有 XML 文档中的文本均会被解析器解析。只有 CDATA 区段（CDATA section）中的...
fetch方式发送请求 1、以get方式发送查询字符串fetch("server.php?查询字符串"[,{method:"...
php获取路径、文件名、扩展名... $path="/test/upload/readme.txt";1、获取路径dirname($pat...
php中的用户数据 数据类型编码器类型发送方式接收数据查询字符串application/x-www-form-urlen...
html中&nbsp;... HTML提供了6种空格实体（space entity），它们拥有不同的宽度，非断行空格（）是常规空格...
swoole的安装 linux下安装swoole需先安装好php。（1）下载swoole源码，解压后进入源码目录，执行如...
js设置html属性和CSS属... js设置html属性：（1）添加属性对象名.属性名=值对象名.setAttribute("属性名",...