关于outline属性

1,outline属性是什么/

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

在浏览器中当使用鼠标或者tab键时一个链接或者button或者焦点的时候，元素周围会出现黑色虚线的框，这个轮廓虚线框就是outline。

2，outline出现的场景

outline 是针对链接、表单控件和ImageMap等元素设计。从而另一个区别也可以推理出，那就是： outline 的效果将随元素的 focus 而自动出现，相应的由 blur 而自动消失。这些都是浏览器的默认行为，无需JavaScript配合CSS来控制。

3，outline出现的好处

outline 能告诉用户那一个可以激发事件的html元素获取了焦点，对钟爱键盘操作的用户尤其有意义。

4，outline的出现的缺点

有时候会影响美观

5，outline属性

outline-color,outline-width,outline-style

6,如何去掉outline

outline：none

7，outline：none在firefox下面依旧存在

解决方法：使用Mozilla的私有属性::moz-focus-inner

input::moz-focus-inner {

　　border：0；

}

 

 

相关文章：

css outline

CSS Compatibility and Internet Explorer

CSS Compatibility and Internet Explorer著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: http://www.w3cplus.com/blog/226.html © w3cplus.com

• css - outlines
• Better CSS outline suppression
• a { outline: none; }
• outline
• Control Element Outline Position with outline-offset
• Remove Button Focus Outline Using CSS
• Removing The Dotted Outline
• Outline
• Outline CSS
• CSS Compatibility and Internet Explorer

著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: http://www.w3cplus.com/blog/226.html © w3cplus.com

 input::-moz-focus-inner,
    button::-moz-focus-inner { 
      border: 0; 
    } 

著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: http://www.w3cplus.com/blog/226.html © w3cplus.com

 

   input::-moz-focus-inner,
    button::-moz-focus-inner { 
      border: 0; 
    } 

著作权归作者所有。
商业转载请联系作者获得授权,非商业转载请注明出处。
原文: http://www.w3cplus.com/blog/226.html © w3cplus.com