gpt4 book ai didi

HTML 跨度元素不会被隐藏

转载 作者:太空宇宙 更新时间:2023-11-03 20:25:27 24 4
gpt4 key购买 nike

在以下代码中,尽管将 position 属性设置为 absolute 并将 overflow 属性设置为 hidden,但 html span 元素并未隐藏。

<!DOCTYPE HTML>
<html>
<body data-rsssl=1>
<div style="height:20px; width:30px; position:absolute">
<span style="overflow:hidden; position:absolute; white-space: nowrap; display:block; top:0px;left:0px;width:100px;height:30px">
span element
</span>
</div>
</body>
</html>

fiddle 在 https://jsfiddle.net/o0h8fmkg/

最佳答案

您必须在修剪元素的父元素上设置 overflow,而不是在被修剪的元素上:

div {
height:20px;
width:30px;
position:absolute;
overflow:hidden;
/** let's see it **/
border: 1px solid red;
}
span {
position:absolute;
white-space: nowrap;
display:block;
top:0px;
left:0px;
width:100px;
height:30px;
}
<!DOCTYPE HTML>
<html>
<body data-rsssl=1>
<div>
<span>span element</span>
</div>
</body>
</html>

关于HTML 跨度元素不会被隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56425065/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com