vue页面响应式布局

其实在使用element-plus之后响应式布局就变得很简单。

不知道这么导入element-plus的请看：http://t.csdnimg.cn/jA71c

响应式布局在element-plus中的Layout布局中有很详细的介绍：

如果要在窗口>=1920px时使用：xl= "24"（这里就涉及到页面布局，整个页面分为24个列）

<el-col :lg="16" :md="12" :xs="0" class="left">
            <div>
                <div>欢迎光临</div>
                <div class="text-light-50 text-1xl">巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉</div>
            </div>
        </el-col>

这里的代码表示：lg当窗口≥1200px时，整个col占比16列；md当窗口≥992px时，整个col占比12列；xs当窗口<768px时，整个col隐藏；

响应式布局就这么简单。