我想在< input>,< select>和< button>中标准化整个宽度和高度(即宽度和高度,包括填充和边框等).不会丢失浏览器默认使用的原生样式.
这可能吗?除了CSS之外,我还愿意使用浏览器检测和JavaScript.
解决方法:
使用
input, select, textarea, button{
-ms-box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
如果你想从宽度吃垫和边框吃
在http://jsfiddle.net/gaby/WaxTS/222/演示
使用
input, select, textarea, button{
-ms-box-sizing:content-box;
-moz-box-sizing:content-box;
-webkit-box-sizing:content-box;
box-sizing:content-box;
}
如果您希望将填充和边框添加到宽度.
演示于http://jsfiddle.net/gaby/WaxTS/224/
对于这种情况的注意事项,按钮将与其余元素不匹配,因为它们具有不同的边框,如果您搞砸了它,则禁用本机外观.