CSS中边框和轮廓属性的区别是什么?
如果没有区别，为什么同一事物有两种性质?
当前回答
来自W3学校网站
CSS边框属性允许您指定元素边框的样式和颜色。
轮廓线是在元素周围(边界外)画的线，使元素“突出”。
大纲简写属性在一个声明中设置所有大纲属性。
可以设置的属性依次为:outline-color, outline-style, outline-width。
如果上面的一个值缺失，例如。"outline:solid #ff0000;"，如果有，将插入缺失属性的默认值。
点击这里查看更多信息: http://webdesign.about.com/od/advancedcss/a/outline_style.htm
其他回答
除了其他答案，概要通常用于调试。Opera有一些很好的用户CSS样式，它们使用outline属性来显示文档中所有元素的位置。
如果您试图找出一个元素为什么没有出现在您期望的位置或没有出现在您期望的大小，添加一些轮廓并查看元素的位置。
正如前面提到的，轮廓不会占用空间。添加边框时，元素在文档中的总宽/高会增加，但outline不会发生这种情况。你也不能在特定的边设置轮廓，比如边界;要么全有，要么全无。
摘自W3Schools:
定义和用法 轮廓是画出来的一条线 在元素周围(边界之外) 让元素“脱颖而出”。
大纲的实际应用涉及透明度。如果你有一个带有背景的父元素，但是想让子元素的边框透明，这样父元素的背景就能显示出来，你必须使用“outline”而不是“border”。虽然边框可以是透明的，但它将显示子元素的背景，而不是父元素的背景。
换句话说，这种设置产生了以下效果:
outline: 7px solid rgba(255, 255, 255, 0.2);
来自:http://webdesign.about.com/od/advancedcss/a/outline_style.htm
CSS outline属性是一个令人困惑的属性。当你第一次了解它时，你很难理解它与边境财产有什么不同。W3C将其解释为以下区别: 大纲不占用空间。 轮廓可以是非矩形的。
CSS中的outline属性在元素的外部画一条线。它和border很相似，只是:
它总是围绕所有的边，你不能指定具体的 它不是盒子模型的一部分，所以它不会影响 元素或相邻元素的位置
来源:https://css-tricks.com/almanac/properties/o/outline/
