input 设置边角时出现阴影改如何解决

时间:2022-06-26 20:21:36
 
 
border-radius:4px;是为div添加圆角,同样适用于input输入框。添加完圆角后input输入框中可能会有阴影,为input输入框重新添加border就可以去除阴影。
 
 

  

<input type="text" name="bianhao" value="" placeholder="请输入商品编号" maxlength="10" size="10" style="width:105px; margin:0px 0px 0px 12px;height:22px;border-radius:4px; border:1px solid #DBDBDB ;"/>

 设置outline:medium; 来取消点击的外边框

设置:focus

       outline: none;
            border-color: #9ecaed;
            box-shadow: 0 0 10px #9ecaed;

  显示点击时样式 让input标签更加美观