gpt4 book ai didi

html - 在包含 float 子 div 的父 div 中水平滚动

转载 作者:行者123 更新时间:2023-11-28 12:49:40 25 4
gpt4 key购买 nike

我有以下代码:

HTML

<div id="parent">
<div class="child">2001</div>
<div class="child">2O02</div>
<div class="child">2003</div>
<div class="child">2004</div>
<div class="child">2005</div>
</div>

CSS

#parent{
width:100%;
overflow:auto;
}

.Child{
float:left;
width:20px;
}

子内容总是泛滥,这很好。但我希望能够在父 div 中水平滚动,以查看最后一个子 div。

这是我得到的结果的屏幕截图:

Screenshot

我该怎么做才能水平滚动?

最佳答案

如果您希望所有子项都在一行中,则必须添加第二个“父”DIV 并设置它的宽度(一行中所有子项的组合宽度):

HTML:

<div id="parent">
<div id="parent2">
<div class="child">2001</div>
<div class="child">2002</div>
<div class="child">2003</div>
<div class="child">2004</div>
<div class="child">2005</div>
</div>
</div>

CSS:

#parent{
width:100%;
overflow:auto;
}


#parent2{
width:1000px;
}

.child{
float:left;
width:200px;
}

关于html - 在包含 float 子 div 的父 div 中水平滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24190204/

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