input的type为checkbox的样式的调整

采用的是若依框架,客户一定要在全选框的前面加个全选。这种boostrap表格,框架自带的东西,真是难死
他一定是个傻子
在这里插入图片描述首先我就简单的写了一些css样式,这种写法,我还是第一次尝试

		/*!*复选框样式*!*/
		input[type=checkbox] {
			margin-right: 10px;
			cursor: pointer;
			font-size: 14px;
			width: 15px;
			height: 15px;
			position: relative;}
		input[type=checkbox]:after {
			position: absolute;
			width: 15px;
			height: 15px;
			text-align:center;
			top: 0;
			content: "";
			color:  #ffffff ;
			display: inline-block;
			visibility: visible;
			padding: 0px 2px;
			border-radius: 3px;
			background:  #ffffff;
			border:1px solid #DDDDDD;
		}
		input[type=checkbox]:checked:after {
			content: "✓";
			color:  #000000  ;
			text-align:center;
			font-size: 12px;
			font-weight:600;
			background-color: #ffffff;
			border:1px solid #DDDDDD;
		}

然后就是怎么把“全选”。加在框后面,想来先去,用before,after都不完美。最后没办法了,自己就加了一列,效果还不错

{
                    field : '',
                    title : '全选',
                    align: 'left',
                    formatter: function(value, row, index) {
                        return '<div class="divstyle" style="width:10px;">' + "" + '</div>';
                    }
                },

累死了

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值