CSS学习笔记--导航栏元素由于页面缩小而被挤到下一行的解决方法


在制作一个页面时我们首先要考虑的就是页面的导航栏,也可以说是菜单栏。下面分别的一些常见网站的导航栏:  

他们的特点都是以width:100%设置宽度,即无论页面放大多少都充满整个页面的宽度,但是页面放大是没有问题了,可是页面如果缩小(即只显示部分页面)就有可能导致导航栏的子元素被挤到下面,随着页面的不断缩小而持续不断地被挤到下一行。

我这里的解决方法是将导航栏在设置一个min-width属性,限制页面缩小时的最小宽度,当低于此宽度时页面出现滚动条,而不会导致元素被挤下来的现象。当然还有另外一种方法是设置响应式布局,根据浏览器大小来分别设置CSS样式,在此不再赘述。

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM