Css 轮廓和边框属性之间的差异

有点像

Outline和border非常相似（尽管它们确实存在差异，如参考问题中所述），但它们以相反的顺序使用完全相同的属性/值。例如：

border: 1px solid black;
outline: black solid 1px;

在我看来，这似乎是一个本应避免的明显矛盾。当同时使用边框和轮廓时，很容易混淆顺序并编写无效的CSS。是否有任何已知的原因使这两个相似的项目以相反的顺序写入相同的值

编辑：

---

似乎（至少在IE8中）两者（有时）都可以接受任意顺序的值，并且工作正常，这使得标准是以这些不同的方式编写它们似乎有点奇怪。

您的假设是错误的。这两个属性的缩写，但值的顺序为

宽度

、

样式

和

颜色

看

---

你可以随心所欲地把它们混合在一起，它仍然可以工作，但这就是浏览器的宽容

你从哪里得到这些信息？一本CSS书籍（）和Visual Studio的IntelliSense认为是这样的，但当我遇到一个错误（不可复制）时，我开始质疑它。当我试图设置CSS“大纲：1px实心红色”时，javascript间歇性地抛出一个错误，说它是无效的。它通常有效，但“大纲：红色实心1px”总是有效。所有CSS速记属性都允许它们的顺序混淆，只要这不会导致歧义。因此，

border

和

outline

都可以按任何顺序指定，而

font

不能。@Jim:那没有意义。你可能无法复制它，因为错误与其他东西有关。@Spudley啊，很公平-我确实想不出可能的歧义。这本身就值得一个答案，不是吗？（即将删除我的）