web 前端-html中用无序列表制作菜单,最小化网页出现的问题

作者:用户 来源:互联网 浏览:491 次 时间:2016-03-29 11:28:52

web 前端

web 前端-html中用无序列表制作菜单,最小化网页出现的问题 - 摘要: html中用无序列表制作菜单,最小化网页出现的问题我使用无序列表做的网页菜单。为什么最大化时好好的,当我收缩的时候,列表就乱了。请大神回答下。谢谢,新手想不出来,有图:代码如下:@charset"ut

问题描述

html中用无序列表制作菜单,最小化网页出现的问题

我使用无序列表做的网页菜单。为什么最大化时好好的,当我收缩的时候,列表就乱了。请大神回答下。谢谢,新手想不出来,有图:
web 前端-html中用无序列表制作菜单,最小化网页出现的问题-无序列表
web 前端-html中用无序列表制作菜单,最小化网页出现的问题-无序列表去掉点
web 前端-html中用无序列表制作菜单,最小化网页出现的问题-html无序列表
代码如下:
@charset "utf-8";
/* CSS Document */
#whole{ text-align:center;}
#head{ background-color:#000; height:536px; }
#titlebar{ background-color:#000; height:50px; margin-top:-19px }
#titlebar .headlist{ margin-left:20%;}
#titlebar .headlist li { list-style-type:none; color:#FFF; font-size:18px; float:left; width:80px; height:16px; text-align:center; background-color:#000; padding:16px;}
#titlebar .headlist .a1{ width:220px; margin-left:240px;}
#rump{ margin-top:600px; background-color:#000; color:#FFF; font-size:10px; height:90px;}
#rump .rumfot1{ margin-top:20px}

解决方案

不管是无序列表还是有序列表,

这种元素我才是块元素,我猜你肯定是采用的了浮动布局,float,这种布局,窗口变小时会自动折行,除非你把父层级别的
设置一个具体的宽度值:width:1000px,比如,这样就不会折行了解决方案二:

布局写位置的时候不要用%,直接用数值100px 这样试试看会不会解决

【云栖快讯】阿里云栖开发者沙龙(Java技术专场)火热来袭!快来报名参与吧!  详情请点击
KubeCon2018西雅图在前线(一):云原生概念已经深入人心
弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率

40+云计算产品,6个月免费体验

现在注册,免费体验40+云产品,及域名优惠!

云服务器9.9元/月,大学必备