页面各种布局的整理
程序员文章站
2022-07-09 19:23:09
关于布局特点缺点单 位静态布局 (适用于pc端)不管浏览器尺寸具体是多少, 网页布局始终是按照最初写代码时的布局来显示的,没有兼容性问题不能根据用户的屏幕尺寸做出不同表现px流式布局屏幕分辨率变化时,页面里的元素的大小会变化, 但是布局不变如果屏幕尺寸跨度太大,那么在其相对原始设计而言过小,过大的屏幕上不能正常显示.非常不友好%自适应布局屏幕分辨率变化时页面内元素的位置会变化而大...
关于布局
特点 | 缺点 | 单 位 | |
---|---|---|---|
静态布局 (适用于pc端) | 不管浏览器尺寸具体是多少, 网页布局始终是按照最初写代码时的布局来显示的,没有兼容性问题 | 不能根据用户的屏幕尺寸做出不同表现 | px |
流式布局 | 屏幕分辨率变化时,页面里的元素的大小会变化, 但是布局不变 | 如果屏幕尺寸跨度太大,那么在其相对原始设计而言过小,过大的屏幕上不能正常显示.非常不友好 | % |
自适应布局 | 屏幕分辨率变化时页面内元素的位置会变化而大小不会变化 | 能根据用户屏幕尺寸做出表现,但是太繁琐.需要创造多个静态布局 | px |
响应式布局 (适用pc. 移动兼容) | (媒体查询)每个屏幕分辨率下面会有一个布局样式,即元素位置和大小都会变 | 媒体查询是有限的,也就是可以枚举出来的,只能适应主流的宽高 | em |
弹性布局 (适用于移动端) | 理想状态是所有屏幕的高宽比和最初的设计高宽比一样,或者差不多,能够完美适应 | 只是宽度自适应,高度并没有做到自适应,针一些对高度、或者元素间距要求较高的设计,布局没有意义 | rem |
本文地址:https://blog.csdn.net/weixin_46278003/article/details/107867830
上一篇: js 图片轮播简单版