zjffun blog

网页标准尺寸

更新于 写于 前端

虽然设计部归前端管,但工作和生活中多少还是会用到,学了略懂还是极好的。

分辨率和页面尺寸

宽度

当前最流行的分辨率是1920*1080的,在该分辨率下,页面中心区域为 1200px 以内都可以。建议 1000-1200

+----------+------------------------------------------+----------+
|          |                                          |          |
|          |                                          |          |
|          |                                          |          |
|          |                                          |          |
|   360    |                   1200                   |   360    |
|          |                                          |          |
|          |                                          |          |
|          |                                          |          |
|          |                                          |          |
+----------+------------------------------------------+----------+
                               1920

其他分辨率情况下的尺寸如下:

  • 800*600下,网页宽度保持在 778 以内;
  • 1024*768下,网页宽度保持在 1002 以内;

高度

首屏的可视区域高度(clientHeight)最大也会比显示器高度小,因为要减去浏览器的标签页、工具栏和书签栏的高度。

页面组件

1920*1080下)顶部 banner 尺寸建议1920*500,最顶部信息栏与导航栏建议高度 40 和 126

字体

ant-design 的标准:

font-size