|
|
@@ -2132,4 +2132,40 @@ th {
|
|
|
height: 24px;
|
|
|
padding-left: 4px;
|
|
|
}
|
|
|
+input[type=checkbox]:checked{
|
|
|
+ background-color: black;
|
|
|
+
|
|
|
+}
|
|
|
+/* 定位禁用的checkbox并重置默认样式 */
|
|
|
+input[type="checkbox"][disabled] {
|
|
|
+ /* 移除浏览器默认样式 */
|
|
|
+ -webkit-appearance: none;
|
|
|
+ appearance: none;
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ border: 2px solid #ccc; /* 未选中时的边框色 */
|
|
|
+ border-radius: 3px;
|
|
|
+ position: relative;
|
|
|
+ cursor: not-allowed; /* 禁用状态的鼠标样式 */
|
|
|
+ background-color: #f5f5f5; /* 禁用未选中时的背景 */
|
|
|
+}
|
|
|
+
|
|
|
+/* 禁用且选中状态的样式 */
|
|
|
+input[type="checkbox"][disabled]:checked {
|
|
|
+ background-color: #2196F3; /* 选中时的背景色(示例:蓝色) */
|
|
|
+ border-color: #2196F3; /* 选中时的边框色 */
|
|
|
+}
|
|
|
+
|
|
|
+/* 自定义选中状态的对勾图标 */
|
|
|
+input[type="checkbox"][disabled]:checked::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ width: 3px;
|
|
|
+ height: 5px;
|
|
|
+ border: solid white; /* 对勾颜色 */
|
|
|
+ border-width: 0 2px 2px 0;
|
|
|
+ transform: rotate(45deg);
|
|
|
+ top: 1px;
|
|
|
+ left: 3px;
|
|
|
+}
|
|
|
</style>
|