如何在分层页面上强制显示css边框？
如何在分层页面上强制显示css边框？
提问于 2009-05-07 19:00:12
我正在尝试编码盒子和胡须图形在html中。问题是，我在div (如Box)周围有边框，但当覆盖包含带状彩色图像的前一层时，这些边框会消失。这里的首选是不使用背景图像(或颜色)，如果可以避免的话。
html为：
<table cellspacing="0" cellpadding="0" id="BoxAndWhiskers" width="100%">
<tr class="graphArea">
<td><div class="graphColors"><img src="ReadingColorScale.png" width="100%" height="250" alt="" /></div>
<div class="graphBoxes"><img src="black.gif" width="2" height="50" alt="" class="Whisker" /><div class="graphBox"><img src="black.gif" width="100%" height="2" alt="" style="padding-top: 10px; padding-bottom: 10px;" /></div><img src="black.gif" width="2" height="50" alt="" class="Whisker" /></div></td>
</tr>
</table>css是：
table#BoxAndWhiskers tr.graphArea td {
width: 33%;
}
table#BoxAndWhiskers tr.graphArea td div.graphBoxes {
z-index: 1;
margin-top: -250px;
}
table#BoxAndWhiskers tr.graphArea td div.graphBoxes img.Whisker {
display: block;
margin-left: auto;
margin-right: auto;
}
table#BoxAndWhiskers tr.graphArea td div.graphBoxes div.graphBox {
margin: 0;
padding: 0;
margin-left: auto;
margin-right: auto;
width: 50%;
border: 2px solid black;
}请注意div.graphBoxes的css中-250px的上边距。当这个值减小时，你会看到长方体周围的边框出现，因为它们从上一层偷看出来。
在这种情况下可以显示边框吗？谢谢..。
回答 4
Stack Overflow用户
回答已采纳
发布于 2009-05-07 22:47:00
如果没有定位，就不能对元素进行分层。
.graphBoxes {
position: relative;
z-index: 1;
margin-top: -250px;
}Stack Overflow用户
发布于 2009-05-07 20:37:53
您可能只需要调整边距和填充，以使边框显示您想要的方式。我的建议是删除所有的填充和页边距，然后添加
* { margin: 0; padding: 0; }添加到样式表的顶部。然后调整所有的填充和页边距，宽度和高度，使它看起来像你的感觉。
请记住，z-index不适用于样式表中没有position-property的元素。
一个谦虚的猜测是，您的负边际导致了问题。
Stack Overflow用户
发布于 2018-07-22 01:25:42
有时，div在css文件中没有指示，因此它会自动将边框或填充设置为某个pix值。如果你在css中指定了img标签，你就可以摆脱这个烦人的设置。我完全同意立场答案。你必须将你创建的任何div或其他选择器设置为相对的、静态的、绝对的等等。位置属性的详尽解释当然可以在CSS W3C中找到。
希望这能给大家进一步的帮助！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/836415
复制相关文章
相似问题
腾讯云开发者
