viewport width:

window.innerWidth == viewport.width
window.screen.width are screen width in points.
window.screen.width === window.outerWidth
window.devicePixelRatio tells how many physical pixels equal 1 css px. 

屏幕的宽度比如 360x720 单位是 pt，1 pt 等于 x 英寸。 css 中 1 px = 实际宽度 1 pt。

实际渲染的像素等于：css px * devicePixelRatio * inital-scale ?

flexbox:

`flex-direction` 指定主轴的方向：row, row-reverse, column, column-reverse, 交叉轴始终在起始点与主轴垂直

`flex-wrap: nowrap` 可指定为 wrap。nowrap 时子元素在主轴上填充 container。

`flex: flex-direction flex-wrap`

默认子元素的 `flex-basis: auto` 根据其内容决定宽度，如果子元素的高度超出 container 的高度（如果设定的话）则会溢出。

`flex-grow: x`: 子元素 cx 的宽度 = c.flex-basis + (container.width - sum_of_c(flex-basis) ) / all(x)