我正在尝试编码盒子和胡须图形在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的上边距。当这个值减小时,你会看到长方体周围的边框出现,因为它们从上一层偷看出来。
在这种情况下可以显示边框吗?谢谢..。
https://stackoverflow.com/questions/836415
复制相似问题