ElementUI组件库

官网:https://element.eleme.cn/#/zh-CN/component/installation

npm 安装

推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用。

npm i element-ui -S

CDN

目前可以通过 unpkg.com/element-ui 获取到最新版本的资源,在页面上引入 js 和 css 文件即可开始使用。

 ElementUI组件库_第1张图片

组件介绍:

  • Layout 布局
  • Container 布局容器
  • Color 色彩
  • Typography 字体
  • Border 边框
  • Icon 图标
  • Button 按钮
  • Link 文字链接

Form

  • Radio 单选框
  • Checkbox 多选框
  • Input 输入框
  • InputNumber 计数器
  • Select 选择器
  • Cascader 级联选择器
  • Switch 开关
  • Slider 滑块
  • TimePicker 时间选择器
  • DatePicker 日期选择器
  • DateTimePicker 日期时间选择器
  • Upload 上传
  • Rate 评分
  • ColorPicker 颜色选择器
  • Transfer 穿梭框
  • Form 表单

Data

  • Table 表格
  • Tag 标签
  • Progress 进度条
  • Tree 树形控件
  • Pagination 分页
  • Badge 标记
  • Avatar 头像
  • Skeleton 骨架屏
  • Empty 空状态
  • Descriptions 描述列表
  • Result 结果

Notice

  • Alert 警告
  • Loading 加载
  • Message 消息提示
  • MessageBox 弹框
  • Notification 通知

Navigation

  • NavMenu 导航菜单
  • Tabs 标签页
  • Breadcrumb 面包屑
  • PageHeader 页头
  • Dropdown 下拉菜单
  • Steps 步骤条

Others

  • Dialog 对话框
  • Tooltip 文字提示
  • Popover 弹出框
  • Popconfirm 气泡确认框
  • Card 卡片
  • Carousel 走马灯
  • Collapse 折叠面板
  • Timeline 时间线
  • Divider 分割线
  • Calendar 日历
  • Image 图片
  • Backtop 回到顶部
  • InfiniteScroll 无限滚动
  • Drawer 抽屉

 ElementUI组件库_第2张图片

ElementUI组件库_第3张图片 

ElementUI组件库_第4张图片 

ElementUI组件库_第5张图片 

 

你可能感兴趣的:(【Web前端框架】)