原生页面转为ElementUI布局

一、模仿页面-原生HTML+CSS

1. 打开要模仿的旧页面，右击保存(保存到哪里自己决定)；
2. 用VScode打开刚保存的文件，显示的是浏览器解析后的代码；
3. 百度搜索:将文件转为html的转换器。推荐站长工具http://tool.chinaz.com/tools/html_js.aspx
4. 新建一个文件，将转换成功的代码复制进去；
5. 右键检查新页面(这时候仅HTML，无CSS)；
6. 再次打开旧页面，右键检查，去控制台一层一层的复制样式(认真点，不然样式不全)。将复制的样式放入新页面的中；
7. 一模一样的页面就差不多做好了，剩下的可以微调；
8. 有JS需求的，要自己手动加。

二、模仿页面-ElmentUI组件

1. 在控制台查看原来页面的布局，根据布局去ElmentUI官网https://element.eleme.cn/#/zh-CN/component/card中使用组件
   推荐： Layout布局，该布局划分为24份；
2. 具体如何快速使用ElmentUI呢，最快的方法也就是多试、多用，用多了自然熟练了；
3. CSS样式，可以在组件上直接添加class，然后将原页面对应的样式复制粘贴过来使用
   例如:
   先在新页面添加class属性，即class名可自定义，然后在，中.str。最后将原页面的对应的class样式粘贴过来使用；
4. 如果要更改组件原来的样式，需要用 /deep/
   注意: 使用/deep/时，其后边必须要有东西，不然会报错；
   例如：