欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

[笔记]解决页面缩小时页面布局会乱的问题

程序员文章站 2022-06-01 17:22:56
给body加上一个min-width最小宽度,以px为单位,这样当页面变小时,当达到你所设置的最小宽度,body的宽度不再改变,超出的部分会用横向滚动条显示,其内所有元素的布局也不会受影响。 使用百分比设置宽度,所有会在页面变化后布局改变的元素的宽度都设置成百分比宽度,这样在缩放时,页面内的各个元素 ......
  1. 给body加上一个min-width最小宽度,以px为单位,这样当页面变小时,当达到你所设置的最小宽度,body的宽度不再改变,超出的部分会用横向滚动条显示,其内所有元素的布局也不会受影响。

  2. 使用百分比设置宽度,所有会在页面变化后布局改变的元素的宽度都设置成百分比宽度,这样在缩放时,页面内的各个元素也会跟着缩放,宽度占比不变,当然前提是设置css样式前,先给body和html这两个元素设置宽度为100%,避免后面出错。

至于高度,建议使用确定的值,不要用百分比,因为页面的大小对高度基本没影响,让元素自己去撑盒子得高度。