01月18, 2018

#兼容性#safari#checkbox

问题描述

在safari浏览器下的选择框在点击时会跳动。

问题代码

<input type="checkbox" id="checkAll"/>
<label for="checkAll">全选</label>

问题分析

查看样式后发现在checkbox的某个样式类中被设置了height值,而在safari浏览器下,如果checkbox设置了height后就会发生跳动现象。

进一步分析

针对这个问题,可能搜索一下,去掉checkbox的height就好了。但是继续问一下为什么

  • 为什么要给input[type=checkbox]设置height,这种方法有无必要呢? 不设置会有什么问题?
  • 为什么safari会跳动,是浏览器bug吗?
  • 如何实现checkbox和label的对齐,如何自定义checkbox背景?

一些思考

本文链接:http://fengbaiyang.cn/post/compatible-safari-checkbox-move.html

-- EOF --

Comments

暂不支持评论,如有问题,请发邮件至baiyang.feng@outlook.com。 望不吝赐教~