Question

我已经使用overflow属性来制作我不想隐藏的div的一半，但整个div都消失了。

.line {
    position: relative;
    overflow: hidden;
}

.gl {
    position: absolute;
    right: 10px;
    width: 100%;
    height: 5px;
    background-color: green;
    display: block;

}

.rl {
    position: absolute;
    width: 100%;
    left: 30px;
    height: 5px;
    background-color: red;
    display: block;
}

和这个HTML代码

<div class='m1'>
        MAIN 1
        <div class='line'><div class="rl"></div><div class='gl'></div>
        </div>
        <div class='des'>kasjfnkvanj</div>
</div>

我想隐藏绿色和红色的两条线，只有溢出父div的延伸部分，但所有这些都被隐藏

任何帮助？

Answer 1

您想要隐藏绿色和红色背景块，但想要显示div.des中的内容。对？你可以对那些div进行显示：none。如果不想要你可以通过删除高度隐藏它们。如果我理解这一点。

height:0;

检查此fiddle。

Answer 2

你想从.line div中隐藏溢出的绿色和红色背景，这次没有显示任何东西，所以你只需要固定的父div（.line）宽度和高度。

.line {
    position: relative;
    overflow: hidden;
    width:100px; height:10px;
}

用溢出隐藏一半的div是行不通的

2 个答案: