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

    相信很多接触前端样式编写的朋友，有遇到过类似这样的情况，在页面上编入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 属性。