Question

任何人都知道li背景图片是否可以延伸到父ul宽度？

这是我的css。

.sideNavigation {
    position: relative;
    background: url(images/sidebarBorderRight.png) top right no-repeat;
}

.sideNavigation li {
    position: relative;
    margin: 0;
    width: 225px;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #DDD;
    font-size: 12px;
}

.sideNavigation li.active {
    position: relative;
    height: 44px;
    line-height: 44px;
    background: url(images/subnavActive.png) no-repeat;
}

和示例html

<ul class="sideNavigation">
    <li class="active"><a href="#">Link 1</a></li>
    <li><a href="#">Link 2</a></li>
    <li><a href="#">Link 3</a></li>
    <li><a href="#">Link 4</a></li>
</ul>

我希望li.active背景显示在ul宽度上，同时将其他li元素保持为当前宽度。

Answer 1

是的，这是可能的。

只需将ul及更大尺寸的固定尺寸设为li，并为display: block设置li，您应该全部设定。您也可以选择使用负边距。

li背景超过父元素元素

1 个答案: