有一个边框,bgr_left.jpg,我想在我的页面上继续沿着 y 轴向下...
bgr_left.jpg 是 30px x 30px,我把它放在一个 div 标签中...我还想在右侧和顶部一直使用相同的边框...
我做不到,这是我的左边框 CSS:
.bgr_left {
background-image: url(../Graphics/bgr_left.jpg);
background-repeat: repeat-y;
background-position: left;
position: absolute;
left: 0px;
top: 0px;
height: 100%;
width: 30px;
background-color: #E7F5F0;
}
感谢大家的帮助
最佳答案
您可以使用表格或动态调整 div 的大小来做到这一点。
表格法
虽然这样的事情在网络浏览器中应该没问题,但搜索引擎和其他计算机消费者可能会误解它,因为您使用表格标记来标记非表格内容。
<table>
<tr>
<td colspan="3" class="bgr_top"/>
</tr>
<tr>
<td class="bgr_left" />
<td>Content content content</td>
<td class="bgr_bottom" />
</tr>
<tr>
<td colspan="3" class="bgr_bottom"/>
</tr>
</table>
动态div
在 jQuery 的帮助下,我们可以生成语义正确的 HTML,还可以在网络浏览器中创建所需的呈现。未经测试的样本:
<p class="bgr">Content content content</p>
<script type="text/javascript">
$('.bgr').each(function(i,el){
$('<div class="bgr_left"/>').height($(this).height()+'px').appendTo($(this));
// similar for top, right, and bottom
});
</script>
关于html - border on side 继续一路往下动态页面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1583390/