6

我正在重新研究 W3Schools 中的 CSS 概念。

我引用了这个有用的网站上的内容：

  • 边框- 围绕填充和内容的边框。边框受框的背景颜色影响

http://www.w3schools.com/css/css_boxmodel.asp

但是，如果我没有为我的边框指定颜色（我正在使用表格进行测试），则不会显示它。

那么 W3Schools 想要表达什么？

4

5 回答 5

6

但是，如果我没有为我的边框指定颜色（我正在使用表格进行测试），则不会显示它。

如果您不指定边框，则没有要绘制的边框。我不明白你引用的陈述是如何相关的。

无论如何，关于手头的实际问题......

元素的边框颜色是否受其背景颜色的影响？

只有在以下情况下：

  • 边界不是完全实心和/或不透明的，并且

  • background-clip不是border-box（默认情况下）

如果它是具有透明区域的边框图像或半透明颜色（例如 anrgba()或hsla()颜色），则背景（如果有）将在边框下方可见。

如果background-clip是，则无论边框是图像padding-box还是content-box半透明颜色，边框甚至都不会与背景重叠。

这些是您必须努力实现的不常见场景，所以我不知道为什么 W3Schools 会费心指出这一点。W3Schools不会费心解释为什么会这样，我并不感到惊讶。郑重声明，那个网站并没有你想象的那么好。请参阅对您的问题的评论以了解原因。

于 2013-04-09T08:25:44.733 回答
1

如果您的边框颜色具有 alpha 值或透明颜色或不纯色，则框的颜色会透出。
http://jsfiddle.net/HerrSerker/WrZRL/

div {
    background-color: black;
    border: 10px solid rgba(255,255,0,0.5);
    width: 100px;
    height: 100px;
    margin: 10px;
}
div.d2 {
    background-color: red;
}
于 2013-04-09T08:26:33.940 回答
1

忽略透明度...

在某些旧浏览器上，边框颜色（如果未明确设置）可能会受到某些border-styles（凹槽、脊、插图、开头等）的背景颜色的影响。例如，旧版本的 Chrome 在斜角边框样式的拐角处（奇怪地）显示了一种中间颜色background-color——尽管这几乎不引人注意，并且与border-color设置无关。（这可能是一个错误，已在以后的版本中修复。）

当border-style设置为“double”时，会background-color在边框内看到 。

但是，我觉得 w3schools 搞错了……

边框受框的背景颜色影响。

当未明确设置时，元素的颜色确实会影响边框的颜色。border-color但这取决于浏览器，因此不可靠。在 Chrome 中，如果没有明确设置，则 sborder-color将与colordotted、dashed、solid 和 double s 相同。border-style

是否显示边框主要取决于border-style("none" 或 "hidden") 和border-width，通常不是border-color- 除非边框颜色与背景颜色匹配，在这种情况下看起来没有边框。

于 2013-04-09T10:14:02.127 回答
0

取决于你选择的组合如果边框更亮你会看到两者如果身体颜色更亮边框变得不那么明显所以在我看来最好选择更亮的边框你可能与我的观点不同..

于 2013-04-09T08:22:56.033 回答
0

如果您的边框颜色和背景颜色相同，则边框将不可见。

于 2013-04-09T08:25:53.460 回答