Loading... ## 继承和表单元素 ## 在一些浏览器中,表单元素默认不会继承字体样式,因此如果想要确保表单填入区域使用body中或者一个父元素中定义的字体,需要向CSS中加入这条规则。 ```css button, input, select, textarea { font-family : inherit; font-size : 100%; } ``` ## form元素与box-sizing ## 跨浏览器的form元素对于不同的挂件使用不同的盒子约束规则。为了保证统一,将所有元素的内外边距均设为0是个好主意,然后在单独进行样式化控制的时候将这些加回来。 ```css button, input, select, textarea { box-sizing: border-box; padding: 0; margin: 0; } ``` <div class="tip inlineBlock success"> 除了上面提到的规则以外,也应该在<textarea>上设置overflow: auto 以避免IE在不需要滚动条的时候显示滚动条 </div> ```css textarea { overflow: auto; } ``` ## 把这一切都综合起来 ## 作为最后一步,可以将上面讨论过的各式属性包起来,成为以下的“表单重置”,以提供一个统一的在其上继续进行工作的地基,这包含了前三节提到的所有东西: ```css button, input, select, textarea { font-family: inherit; font-size: 100%; box-sizing: border-box; padding: 0; margin: 0; } textarea { overflow: auto; } ``` Last modification:July 26, 2021 © Allow specification reprint Support Appreciate the author AliPayWeChat Like 如果觉得我的文章对你有用,请随意赞赏
2 comments
看到你的网站,觉得很不错,希望能与你互相友情链接…
我的网站:建站知道网-http://wozhidaole.com.cn/
如果同意的话,回复后互相上链接!
好啊OωO