首页 > input的样式初始化问题

input的样式初始化问题

<input type="button" value="click"/>
input{
    padding:0;
}

这样写初始化不了padding,只有在添上border:none;后padding才会被初始化为0,为什么会出现这种情况,谁能告诉我这期间浏览器的底层都做了些什么

其实我就想知道这个前后浏览器引擎是怎样解析的,在解析到input的初始化样式时浏览器的解析机制是怎样的?!

求大神帮忙解答下疑惑!


给表单控件设置 CSS 样式是个大坑。
浏览器对表单控件的渲染,应该是直接调用操作系统的相关控件,所以你可以看到不同操作系统下同样的表单控件呈现形式也不同。
所以给表单控件设置 CSS 样式很多情况下并不可靠,比如你说的 input button 设置 padding 不生效,我在 windows + chrome 的环境下就没有遇到,可能其他浏览器就会有问题。
所以如果要给按钮等控件应用比较复杂精确的样式,建议使用自定义的控件来完成(如用 a 来代替 button),这些元素的盒模型和 CSS 属性至少是可信赖的。

【热门文章】
【热门文章】