【CSS】逐风教你如何去掉谷歌浏览器下的外边框样式

相信很多接触前端样式编写的朋友,有遇到过类似这样的情况,在页面上编入input、button等HTML标签,在各大浏览器上浏览

    相信很多接触前端样式编写的朋友,有遇到过类似这样的情况,在页面上编入input、button等HTML标签,在各大浏览器上浏览,特别是在谷歌浏览器下浏览时,会发现输入框或者按钮在点击的时候会莫名的多出个外边框的样式出来,例如下图:

经过一番研究,终于找到了解决的方法,在CSS中加入:

outline: 0;

就可以去除这多余的样式了;


以下是对outline属性的介绍:

outline 定义和用法

    outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。


注释:轮廓线不会占据空间,也不一定是矩形。

      outline 简写属性在一个声明中设置所有的轮廓属性。


可以按顺序设置如下属性:

outline-color
outline-style
outline-width


以下是属性实践:

p {
border:red solid thin;
outline:#00ff00 dotted thick;
}

执行结果:

注释:只有在规定了 !DOCTYPE 时,Internet Explorer 8 (以及更高版本) 才支持 outline 属性。

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

设置或获取对象指定的文件名或路径。alert(window.location.pathname
DEDE项目上 编辑软件大小(单位换算):$(doc
script language="javascript"&g
JQ代码如下:script langu