height 100%不起作用，100%和100vw/vh的区别

1.height设置成100%时发现高度没有变化

在此处我们可以看到我们把page类已经设置了100%，发现高度并没有占满屏幕，那是height:100%这个100%是相对于他的父元素来说的，通过图2我们可以看到page标签的高度就是自适应，因此即使.content的高度设置成100%那么他顶多就是他的父元素的高度，

在此处若想使渐变背景能够占满整个屏幕的高度，有两种方法：1、page标签的高度设置成100%，如图3；2.content的height高度为100vh.如图4

                                                                                        图1

                                                                                            图2

                                                                                图3

                                                                                      图4

2、 100%和100vh/vw的区别。

% 是相对于父元素的大小设定的比率。

vw (viewport width) vh (viewport height) 是视窗的大小，100vw = 100%视窗宽度 100vh = 100%视窗高度，用vw，vh设定的大小只和视窗大小有关，和他们的父元素高度宽度没关系，所以用来开发多种屏幕设备的应用用这个单位还是挺合适的，