CSS打造末尾自动伸缩的菜单

来源:互联网 发布:js树状结构代码 编辑:程序博客网 时间:2024/05/01 21:17
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>CSS末尾自动伸缩菜单</title><style>#box{width:100%;background:#CCC;}#box div{height:30px;}.menu{background:#FF9900;float:left;}</style></head><body><div id="box"><div class="menu">菜单1</div><div class="menu">菜单2</div><div>菜单3</div></div></body></html>

 

 

 

菜单3的宽度会自动延伸到父容器的最右侧,不论前面的菜单宽度多少,个数多少,都不影响

但是最好不要让前面的个数和宽度到了挤到第二行的地步,那样可能菜单3会被挤下去,操作中发现,不是一定会,这个得看前面菜单的宽度

 

原创粉丝点击