我正在尝试 HTML和CSS。我给div设置背景色,效果很好。但是,当我将position属性赋予其子级​​时,背景颜色属性不起作用。为什么?

例如,当我在ul中删除此属性时,背景颜色显示。但是当我将此属性应用于ul时,背景颜色不显示为什么?

ul{
position:absolute;
right:0px;
}




<div style="background:blue;position:relative">
<ul><li><a></a>aa</li><li><a>h</a></li></ul>

</div>

最佳答案

由于div的所有内容都绝对定位,因此div实际上没有高度。您将需要手动设置div的高度。

如果div的内容全部浮动,也会发生类似的情况;但是,一种解决方法是在包含的div上使用overflow:hidden;。您可以在this fiddle上查看其演示。它实际上产生了我认为您正在尝试实现的结果。

<div style="background:blue;position:relative;overflow:hidden;">
    <ul><li><a></a>aa</li><li><a>h</a></li></ul>
</div>



ul{
    float:right
}

10-05 20:45
查看更多