隐藏可滚动标签内滚动

问题描述：

我需要滚动div的部分并忽略其他部分的滚动。隐藏可滚动标签内滚动

在我的例子中，我需要滚动蓝色和绿色，但要红色留在它的位置。

<div style="width: 100px; 
 
    height:200px; 
 
    border: solid black 1px; 
 
    overflow-x: auto"> 
 
    <div style="width: 120px; height: 50px;background-color:blue"> 
 
    </div> 
 
    <div style="width: 100px; height: 30px;background-color:red"> 
 
    </div> 
 
    <div style="width: 120px; height: 50px;background-color:green"> 
 
    </div> 
 
</div>

有没有人有一个想法如何解决我的问题？

答

您可以使用position: fixed：

#wrapper { 
 
    width: 100px; 
 
    height:200px; 
 
    border: solid black 1px; 
 
    overflow-x: auto; 
 
} 
 

 
#blue { 
 
    width: 120px; 
 
    height: 50px; 
 
    background-color:blue; 
 
} 
 

 
#red { 
 
    width: 100px; 
 
    height: 30px; 
 
    background-color:red; 
 
    position: fixed; 
 
} 
 

 
#green { 
 
    width: 120px; 
 
    height: 50px; 
 
    background-color:green; 
 
}

<div id="wrapper"> 
 
    <div id="blue"></div> 
 
    <div id="red"></div> 
 
    <div id="green"></div> 
 
</div>

非常感谢您的回答。在我的真实代码中，我已经在标签上使用了position：block属性，所以我不能使用fixed。有没有其他方法来修复标签？ – user7521838

不客气！如果你想获得高质量的答案，你必须提供所有有意义的信息。如果您可以使用更好地复制您的代码的示例更新您的问题，我将很乐意提供帮助 –

答

执行此change.It工作对我来说：

<div style="width: 100px; height:200px; border: solid black 1px;overflow-x: auto"> 
    <div style="width: 120px; height: 50px;background-color:blue"> 
    </div> 
    <div style="width: 100px; height: 30px;background-color:red;position:fixed;"> 
    </div> 
    <div style="width: 120px; height: 50px;background-color:green"> 
    </div> 
    </div>

希望这是你想要的。

隐藏可滚动标签内滚动

相关推荐