用DIV+CSS做的横纵向导航条,当浏览器缩小时,里面的内容会自动缩到第二行与第一行对齐

如题所述

<style>
.menu{width:100%;height:100px;background:#f00;}
.menu .nav{width:120px;height:100px;line-height:100px;text-

align:center;background:#00f;float:left;margin-right:10px;color:#fff;}
</style>
<div class="menu">
<div class="nav">菜单1</div>
<div class="nav">菜单2</div>
<div class="nav">菜单3</div>
<div class="nav">菜单4</div>
<div class="nav">菜单5</div>
<div class="nav">菜单6</div>
</div>

给nav做float:left;向左浮云，这样，当menu这个容器宽度缩小后，浮云就会自动向下排去了。

温馨提示：内容为网友见解，仅供参考

当前网址：https://11.t2y.org/zz/fm7mf4pfv2pqssmp2s4.html