HTML

    <ul class="box">
<li>
<input type="checkbox" name="vehicle" id="vehicle">
<label for="vehicle">第一个选项</label>
</li>
<li>
<input type="checkbox" name="vehicle" id="vehicle2">
<label for="vehicle2">第二个选项</label>
</li>
</ul>

CSS

    ul,
li {
padding:;
margin:;
list-style: none;
} .box input[type="checkbox"] {
width: 12px;
height: 12px;
border: 1px solid #e2e2e2;
background: none;
box-shadow: none;
} .box input[type="checkbox"] {
-webkit-appearance: none;
appearance: none;
display: inline-block;
margin: 0 2px 2px 0;
width: 12px;
height: 12px;
cursor: pointer;
outline: none;
vertical-align: middle;
border: 1px solid #e2e2e2;
} .box input:checked {
border: 1px solid #13af13;
}
.box input:checked::before {
content: "";
display: block;
position: relative;
width: 3px;
height: 6px;
left: 34%;
top: 9%;
border-right: 1px solid #13af13;
border-bottom: 1px solid #13af13;
transform: rotate(45deg);
background: none;
}

CSS设置input默认样式的更多相关文章

  1. CSS系列——浏览器默认样式

    了解HTML标签在各浏览器当中的默认样式,可以让我们了解,为什么会要写Reset.css,Reset.css当中要怎么写样式最合理.试着思考下面的问题: 为什么会有默认样式? 每个浏览器的默认样式有什 ...

  2. css清除浏览器默认样式

    css清除浏览器默认样式(代替 *{}) 将代码放入 css 文件,使用 link 引入. /* v2.0 | 20110126 http://meyerweb.com/eric/tools/css/ ...

  3. CSS设置input placeholder文本的样式

    placeholder是HTML5  input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值. 下面是设置placeholder的文本样式的选择器的示例: /* webkit 浏 ...

  4. css设置input获得焦点的样式

    input:focus{ 样式; } 这样就ok

  5. 16 input默认样式清除

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...

  6. 设置TextBlock默认样式后,其他控件的Text相关属性设置失效问题

    问题: 定义了默认TextBlock样式后,再次自定义下拉框 or 其他控件 ,当内部含有TextBlock时,设置控件的字体相关样式无效,系统始终使用TextBlock设置默认样式 解决方案: 为相 ...

  7. safari input默认样式

    在i标签下嵌套一个input标签  设置了 -webkit-apprarence:none: 设置了宽高,和padding:3px 结果placeholder显示不全 经排查 这时候的input默认有 ...

  8. CSS实现input默认文字灰色有提示文字点击后消失鼠标移开显示

    CSS实现input美化操作默认是为灰色,并且有提示 如下图 鼠标点击后文字消失,鼠标移开后文字显示 给input入下图添加代码 style="color:#cccccc; outline: ...

  9. css设置input中placeholder字体

    设置input中placeholder字体颜色 input::-webkit-input-placeholder {color:@a;} input:-moz-placeholder {color:@ ...

随机推荐

  1. Window下UDP(socket)接和收数据案例

     配置QT的环境变量,这台电脑à属性à高级系统设置à高级à环境变量à系统变量àpathàC:\Qt\Qt5.3.0\5.3\mingw482_32\bin;C:\Qt\Qt5.3.0\Tools\ ...

  2. 怎样在BIOS中设置RAID?

    随着价格的下降和相应主板的支持.眼下SATA硬盘已经逐渐成为主流. 但因为受芯片组和操作系统的影响.不少用户对SATA硬盘的使用及安装系统掌握不足,今天小编就给大家介绍一下SATA硬盘的日常应用技巧. ...

  3. 对于HBase的MapReduce性能提升方案之BulkLoad

    我们知道,在第一次海量数据批量入库时,我们会选择使用BulkLoad的方式. 简单介绍一下BulkLoad原理方式:(1)通过MapReduce的方式,在Map或者Reduce端将输出格式化为HBas ...

  4. QueryString 地址栏参数

    MXS&Vincene  ─╄OvЁ  &0000002 ─╄OvЁ  MXS&Vincene MXS&Vincene  ─╄OvЁ:今天很残酷,明天更残酷,后天很美好 ...

  5. android4.4的两个bug

    Android4.4做了大量的改动.但也造成了非常多新的问题. 工作中碰到了几个比較有趣的bug.这两个bug在nexus 5上也有. 记录一下.以资纪念 1.Android4.4在解析jpg头的时候 ...

  6. DotNetBar.Bar作为容器使用的方法及Text更新原理

    DotNetBar.Bar作为容器使用的方法及Text更新原理                          老帅    一.容器用法   控件DevComponents.DotNetBar.Ba ...

  7. Oracle 静态监听注冊具体解释

    Oracle 静态监听注冊具体解释 网上有非常多关于oracle 监听静态注冊的文章.但大多都是简单说说,并没有具体的样例.这里,将结合linux as4 下的oracle 10gR2.0.1 举一个 ...

  8. 洛谷⑨月月赛Round2 官方比赛 OI

    自评: (完成时间3.5时) 第一题 模拟 虽然A了,代码敲得有点慢 第二题 最短路 第一次敲对了,又考虑数据范围和答案范围,改错了,100分改成42分.QAQ. 第三题 乱搞 80分 还可以(因为没 ...

  9. springboot 异常: Requested bean is currently in creation: Is there an unresolvable circular reference?

    2018-07-31 11:56:18.812 WARN 10316 --- [ main] ConfigServletWebServerApplicationContext : Exception ...

  10. Spark底层原理简化版

    目录 Spark SQL/DF的执行过程 集群运行部分 Aggregation Join Shuffle Tungsten 内存管理机制 缓存敏感计算(Cacheaware computation) ...