请问前端那种可视化大屏该如何用 CSS 布局

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 2071 天前的主题，其中的信息可能已经有所发展或是发生改变。

类似淘宝那种页面都是固定一个最小宽度，然后两边留白。如果要完美做到横向纵向铺满整个屏幕且无滚动条，该利用哪些 css 属性来布局。

想到一种极端办法，所有元素尺寸都是百分数，但是字体和边距该怎么办

CSS

边距

布局

字体

6 条回复 • 2020-05-27 21:22:52 +08:00

liyang5945

2020 年 5 月 27 日

rem 可破，其实就是百分比

clown007

2020 年 5 月 27 日

用背景图片
body {
background-image: url('xxx');
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}

remon

2020 年 5 月 27 日 via Android

2020 年了，vw, vh

dioxide

2020 年 5 月 27 日

补充下: css grid 对此场景挺有用的

ArtIsPatrick

2020 年 5 月 27 日 via iPhone

字体也百分比呗

zhyd1997

2020 年 5 月 27 日

postcss-px-to-viewport