我需要下面代码的水平滚动条。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<h1 class="page-header">Horizontal Scroll in bootstrap</h1>
<div class="container-fluid" style="overflow-x:scroll;">
<div class="col-sm-3">
<h3>Tree 1</h3>
</div>
<div class="col-sm-3">
<h3>Tree 2</h3>
</div>
<div class="col-sm-3">
<h3>Tree 3</h3>
</div>
<div class="col-sm-3">
<h3>Tree 4</h3>
</div>
<div class="col-sm-3">
<h3>Tree 5</h3>
</div>
</div>
</body>
</html>
如果执行上述行,则输出显示为图像。但我需要5号树接4号树。不在树下1。如果我增加树6,它显示为树5之后。也就是说,我需要水平滚动条。请帮帮我。
最佳答案
可能是:
style="overflow-x:scroll; white-space: nowrap;"
然后在css中:
.col-sm-3{display: inline-block;}
fiddle
关于html5 - bootstrap -水平滚动条,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31402306/