在浏览器里，当鼠标点击或使用Tab键让一个链接或者一个radio获得焦点的时候，该元素将会被一个轮廓虚线框围绕。这个轮廓虚线框就是 outline 。
CSS 的 outline 属性允许我们改变这个默认的轮廓虚线框效果。其配套的相关属性包括：
outline
outline-width
outline-style
outline-color
outline-offset
其中第一个 outline 是速写(shorthand)形式，格式为： outline: outline-color || outline-style || outline-width
如果想让链接获取到焦点时更醒目，可以设置轮廓线条为红色，outline 属性的设计可能如下：
a { outline-color: red; }
而如果想去掉影响美观的Tab上的轮廓线条，outline属性可如下设置：
.active-tab { outline: none; …… /* other properties */}
outline 与 border 的区别
border 可应用于几乎所有有形的html元素，而 outline 是针对链接、表单控件和ImageMap等元素设计。从而另一个区别也可以推理出，那就是： outline 的效果将随元素的 focus 而自动出现，相应的由 blur 而自动消失。这些都是浏览器的默认行为，无需JavaScript配合CSS来控制。并且outline 不会象border那样影响元素的尺寸或者位置。
未经允许不得转载：前端撸码笔记 » outline是什么，outline与border有什么区别