当前位置：文江博客话题详情

CSS 中的部分边框没有背景重叠

发布于 2024-12-29 00:25:05 字数 199 浏览 1 评论 0原文

我有两个带边框的 div，如何仅删除两个 div 接触的边框，如下图所示？但如果没有背景重叠，我的意思是这里背景必须是透明的。问题听起来像这个 CSS 中的部分边框但是！没有背景颜色重叠。而且它的液体尺寸，意味着不固定。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

哭了丶谁疼 2025-01-05 00:25:05

如果您的 div 都是静态高度，您可以使用伪元素来伪造边框：

div {
    border: 1px solid black;
}
#small {
    border-right-width: 0;
    height: 80px;
}
#big {
    border-left-width: 0;
    height: 200px;
    position: relative;
}
#big:before {
    content: ' ';
    border-left: 1px solid black;
    position: absolute;
    height: 120px;
    left: 0; top: 80px;
}

这是小提琴： http://jsfiddle.net/FrKZy/

您可以使用 Javascript 使其与动态高度一起工作。

警告：这在 IE7 或更低版本中不起作用。

If your divs are both static height, you can use a pseudo element to fake the border:

div {
    border: 1px solid black;
}
#small {
    border-right-width: 0;
    height: 80px;
}
#big {
    border-left-width: 0;
    height: 200px;
    position: relative;
}
#big:before {
    content: ' ';
    border-left: 1px solid black;
    position: absolute;
    height: 120px;
    left: 0; top: 80px;
}

Here's the fiddle: http://jsfiddle.net/FrKZy/

You could probably make it work with dynamic heights using Javascript.

Warning: this won't work in IE7 or under.

回复收藏 0 原文

~没有更多了~