ElementUI Container布局容器理解和使用

小威编程

已于 2022-03-23 23:28:37 修改

阅读量5.3k

点赞数

文章标签： vue.js css3

于 2022-03-23 23:07:37 首次发布

本文链接：https://blog.csdn.net/dawfwafaew/article/details/123698700

版权

转载于：

elementUI Container 用于布局的容器组件，方便快速搭建页面的基本结构：

十分方便然我们节省布局的时间然我们有更多的精力放在我们要做的功能上

一、理解：

Container(肯特呢)容器是elementUI 采用flex布局，编写的一套组件。

<el-container>:外成容器。当子元素中包含<el-header>时候，全部的子元素会全部垂直上下排列，要不然就会水平排列

<el-header> ：顶部容器

<el-aside>:侧边栏容器

<el-main>:主要内容区域

先在项目下输入命令：

   npm install element-ui -S

在main.写入

// 引用elementui
import ElementUI from 'element-ui'

import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

在要显示的组件之间复制elementUI的代码和css

可以看到我们就可以看到布局的大概样子了

如何根据自己的需要写组件放到相应的容器里面就好了

关注