Input元素去除获取焦点时的边框
程序员文章站
2022-07-07 19:58:38
...
Input元素去除获取焦点时的边框
1.1概述
在网页中,用tab键切换时,文字链接、搜索框、按钮等的外面会有一个虚线框(或高亮框),此时当前的元素就获得了焦点,可以对其进行操作。
注意:这个功能一般是为使用键盘操作的用户准备的,建议一般不要去掉。
input标签获取焦点的时(如:光标放在input框中准备输入值时), input标签外围会出现边框,如果需要去掉这个边框,可以使用css的outline:none;(当元素获得焦点时焦点框为0)属性。
1.2拓展——CSS outline属性
1、定义
outline(轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。outline是一个简写属性,在一个声明中设置所有的轮廓属性,即可以按顺序设置outline-color、outline-style、outline-width属性。
注意:
1》轮廓线不会占据空间,也不一定是矩形。
2》如果outline不设置outline-color、outline-style、outline-width其中的某个值,也是允许的,比如outline:solid #ff0000;。
3》请始终在outline-color属性之前声明outline-style属性。因为元素只有获得轮廓以后才能改变其轮廓的颜色。
2、浏览器支持
所有浏览器都支持 outline 属性。
注意:
如果规定了 !DOCTYPE,则 IE8 支持 outline 属性。