2

我正在尝试删除活动菜单项与右内容 div 相遇的左边框。

见http://d.pr/i/hfRZ+

所以看起来活动元素与主要内容div的级别相同，就像这个http://dribbble.com/shots/663779-Left-navigation

如果重要的话，我正在使用 twitter bootstrap。

任何指针都非常感谢！

编辑：这里是 HTML/CSS 的链接

查看： http ://codepen.io/anon/full/Asrnm

编辑 http://codepen.io/anon/pen/Asrnm

4

4 回答 4

4

您不能部分移除边框，您只能将它们遮盖起来。您需要使所选项目与边框重叠（或有一个脚本将另一个元素放在边框上）。

于 2012-09-20T19:09:53.620 回答
3

我拍了一个演示：http ://dabblet.com/gist/3762742

使用 :after 与父级的 1px 宽度和背景颜色重叠右框的边框。

于 2012-09-21T18:43:48.897 回答
0

您可以让所选项目只有一个顶部和底部边框

.selected-item
{
    border-top: 1px solid rgba(0, 0, 0, 0.5);
    border-bottom: 1px solid rgba(0, 0, 0, 0.5);
}

或者

.selected-item
{
    border: 1px solid rgba(0, 0, 0, 0.5);
    border-left: 0px;
    border-right: 0px;
}

并且为了避免框阴影逃离父容器，您可以将其替换为

.selected-item:after
{
    display: block;
    position: absolute;
    height: 10px;
    background: url("gradient.gif") top left repeat-x;
}

这样，您会在元素下方获得一致的水平阴影，一直到但不超过父元素及其边框。

于 2012-09-20T19:16:10.137 回答
0 
.selected-item {
  border-left: 0px;
  border-top: 0px;
  border-right: 0px;
  border-bottom: 0px
}
于 2016-02-02T14:02:06.973 回答