虚线边框的背景颜色

Question

我目前有这样的HTML结构：

<div id="holder">
    <div id="content">...</div>
    <div id="footer">...</div>
</div>

CSS就像这样：

* {
    margin: 0;
    padding: 0;
}

#content, #footer {
    background: #fff;
}

#footer {
    border-top: 1px dashed #ddd;
}

注意： holder没有任何background-color

---

我担心footer上边框的背景将是透明的，因为holder没有任何背景。

在holder中应用白色背景不是我的选择（我不会解释为什么不，但相信我，这是不可能的）

我的问题：

• 虚线边框的背景与我footer的背景相同 （白色）或holder（无）的背景色？
• 它是否会以同样的方式表现出跨浏览器？

Answer 1

1. 边框属于您的#footer div，并使用其背景属性进行渲染 - 清除或其他。

2. 我在Chrome，Safari，Firefox中测试了以下CSS（抱歉，没有即时的IE访问权限）：

   * { margin: 0; padding: 0; }
   
   #content, #footer { background: #fff; }
   
   #content { background:#00F; }
   
   #footer {
       border-top: 5px dashed #f00;
   }
   

如果我错过了你的问题，请告诉我，但我相信这就是你的要求。

  

框的内容，填充和边框区域的背景样式由生成元素的“background”属性指定。保证金背景总是透明的。

通过http://www.w3.org/TR/CSS2/box.html