Question

我希望在横排中并排一些div。我希望容器只能一次滚动显示行的一部分。目前，div只是一列。也许我疯了，不明白为什么这不起作用。谢谢！

请参阅此JSFiddle：http://jsfiddle.net/42kurwtp/

HTML

    <div style="width: 300px; height: 300px; overflow:scroll;">
        <div id="blue"></div>
        <div id="red"></div>
        <div id="green"></div>
        <div id="yellow"></div>
    </div>

CSS

<style>
div {
    width: 200px;
    height: 200px;
    float: left;
}
    #blue {
        background: blue;
    }

    #red {
        background: red;
    }

    #green {
        background: green;

    }

    #yellow {
        background: yellow;
    }
</style>

Answer 1

＆＃13;

<style> #row {
  overflow: scroll;
  width: 900px;
  height: 70px;
}
#row div {
  width: 200px;
  height: 200px;
  float: left;
}
#blue {
  background: blue;
}
#red {
  background: red;
}
#green {
  background: green;
}
#yellow {
  background: yellow;
}
</style>

＆＃13;

<div class="row" id="row">
  <div id="blue">&nbsp;</div>
  <div id="red">&nbsp;</div>
  <div id="green">&nbsp;</div>
  <div id="yellow">&nbsp;</div>
</div>

＆＃13;

并排划分，只有部分可见

1 个答案: