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

input输入框在前台显示会有默认的border,所以我们在给input输入框设置高度的时候会不准确,影响了网站整体布局的美观,今天就告诉大家该如何消除input输入框默认样式,其实很简单,给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交流以及问答互动,编程语言免费教学,有问题来本站问答栏目,本站及时问您解答。

你可能感兴趣的文章

相关问题

0 条评论

请先 登录 后评论
admin
admin

651 篇文章

作家榜 »

  1. admin 651 文章
  2. 粪斗 185 文章
  3. 王凯 92 文章
  4. 廖雪 78 文章
  5. 牟雪峰 12 文章
  6. 李沁雪 9 文章
  7. 全易 2 文章
  8. Garmcrypto7undop 0 文章