为什么在chrome下我的单选按钮设置宽高厚大小还是一直不变?我的chrome版本42,64bit,但是在火狐下按钮就变大了。老师的视频不就是在chrome下录制的么,为何相差这么大。。。有没有人和我遇到一样的问题啊?
在手机上设置宽高也不起作用啊 样子没变大 生效区域也没变大
这里并不是要他“看起来”变大了,而是要他的”生效区域“变大;有些浏览器,设置了宽高后,那个小按钮看起来没变大,但是实际上,他的作用范围是变大了的。你可以尝试一下鼠标点击他的旁边,不要点击那个小按钮,看看能不能选中按钮。如果能,那么这个效果就足够了。只要在你需要设置的范围内,点击鼠标,能够让他变成checked状态就行了。至于他看起来怎么样大小不重要。
原生单选按钮和多选按钮那么丑,样式还不好兼容,所以用图片代替吧
#raidobtn { -webkit-appearance: none; -moz-appearance: none; }
这样能实现大小一致,不过会破坏input text="radio"原有的样式。不推荐使用,你的问题应该是浏览器预编译出现的问题。期待大牛有更好的解决方式。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> #test{ background-color: #ccc; border:1px solid red; width: 200px; height: 200px; } #radiobtn{ height: 100px; width :100px; } </style> </head> <body> <div id="test"> <input type="radio" id="radiobtn"> test</input> </div> </body> </html>
代码如上,分别截图:
firefox上长这样:
chrome下长这样:
求帮忙。。。。