如何消除input表单输入框的默认样式

        input输入框在前台显示会有默认的border,所以我们在给input输入框设置高度的时候会不准确,影响了网站整体布局的美观,今天就告诉大家该如何消除input输入框默认样式,其实很简单,给input添加以下css代码,即可清除input输入框默认样式,下面为大家奉上代码。


 input, button, select, textarea
{
outline: none;
-webkit-appearance: none;
border-radius: 0;
}


以上为清除input输入框默认样式的css代码,我们现在讲一下消除input输入框默认样式的原理,大家可以自己一行一行添加,有助于理解消除input输入框默认样式的的原理;

其中outline: none;代码意思为去掉chrome浏览器自带的点击input框出现边框情况;
-webkit-appearance: none;去掉按钮样式
border-radius: 0;去掉圆角

       以上便是如何消除input表单输入框的默认样式的相关方法,望大家关注段龙龙博客,本站还提供模板下载,SEO交流以及问答互动,编程语言免费教学,有问题来本站问答栏目,本站及时问您解答。
如何消除input表单输入框的默认样式

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.duanlonglong.com/qdjy/15.html