• 技术文章 >web前端 >css教程

    css怎么去掉input边框

    藏色散人藏色散人2021-04-02 13:52:32原创102

    css去掉input边框的方法:1、通过直接在input中加“style=“outline:none;””来去掉input边框;2、在顶部style中直接控制css样式为“input{outline:none;}”即可。

    本文操作环境:Windows7系统、HTML5&&CSS3版,DELL G3电脑

    去掉input边框的具体操作步骤如下:

    1、在html页面中输入input的相关代码。

    <div class="form"><input id="code" class="ipx code" name="code" placeholder="请点击按钮领取礼包" type="text"><input type="button" class="send" value="发送"></div>。

    fa0d4a123377df61aec2cf0c1303c12.png

    2、打开浏览器,出现点击input出现了蓝色边框。

    557cf84e16ba16bf107ed76f189b92a.png

    3、直接在input中加style=“outline:none;”。

    95afdfebb355b837421adabba107a80.png

    4、在顶部style中直接控制css样式:<style type="text/css"> input{outline:none;}</style>。

    067c714ee72b8e44eac21e66b5420d9.png

    5、直接用 input:focus { outline: none; } 控制聚焦即可去掉蓝色边框。

    e4aa45a05914de5813a4da102ee59ed.png

    推荐学习:《css视频教程

    以上就是css怎么去掉input边框的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css
    上一篇:css的盒模型有哪些 下一篇:css文本怎么设置水平对齐
    第15期线上培训班

    相关文章推荐

    • css的含义是什么• css怎么让li强制不换行• css怎么设置div边框• css的盒模型有哪些

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网