首页 > 其他分享 >Element基本组件

Element基本组件

时间:2022-10-31 23:01:39浏览次数:74  
标签:基本 成功 Element 危险 按钮 组件 警告

 

Element按钮组件:

 

 

<el-row>
  <el-button>默认按钮</el-button>
  <el-button type="primary">主要按钮</el-button>
  <el-button type="success">成功按钮</el-button>
  <el-button type="info">信息按钮</el-button>
  <el-button type="warning">警告按钮</el-button>
  <el-button type="danger">危险按钮</el-button>
</el-row>

<el-row>
  <el-button plain>朴素按钮</el-button>
  <el-button type="primary" plain>主要按钮</el-button>
  <el-button type="success" plain>成功按钮</el-button>
  <el-button type="info" plain>信息按钮</el-button>
  <el-button type="warning" plain>警告按钮</el-button>
  <el-button type="danger" plain>危险按钮</el-button>
</el-row>

<el-row>
  <el-button round>圆角按钮</el-button>
  <el-button type="primary" round>主要按钮</el-button>
  <el-button type="success" round>成功按钮</el-button>
  <el-button type="info" round>信息按钮</el-button>
  <el-button type="warning" round>警告按钮</el-button>
  <el-button type="danger" round>危险按钮</el-button>
</el-row>

<el-row>
  <el-button icon="el-icon-search" circle></el-button>
  <el-button type="primary" icon="el-icon-edit" circle></el-button>
  <el-button type="success" icon="el-icon-check" circle></el-button>
  <el-button type="info" icon="el-icon-message" circle></el-button>
  <el-button type="warning" icon="el-icon-star-off" circle></el-button>
  <el-button type="danger" icon="el-icon-delete" circle></el-button>
</el-row>

 

标签:基本,成功,Element,危险,按钮,组件,警告
From: https://www.cnblogs.com/ZhuAo/p/16846206.html

相关文章

  • 堆排序的基本知识
    堆的性质分为大根堆和小根堆,性质为结点的左右孩子大于或小于根节点(1)堆是一颗完全二叉树;(2)小(大)顶堆中的每一个节点都不小于(不大于)它的父节点;(3)堆的插入、删除......
  • Flutter 短信验证码组件
    效果图思路因为需要弹出键盘,所以使用了一个隐藏的TextField,通过点击事件捕获焦点,方块只做展示使用。组件代码import'package:bubble_mobile/util/func_utils.dart';......
  • 微信小程序动态增加组件(以按钮为例)
    这里的微信小程序动态加载是以按钮为例,主页面点击不同的按钮进入不同的子页面中,根据主页面的title来动态加载子页面按钮的数量以及值。效果图:wxml文件(注意wx:key="item"要写......
  • Linux文件系统组成和基本操作
    1、文件系统的组成Linux文件系统的结构:Linux单根倒树状严格区分大小写windows多根多树状(多根指的是分区)不区分大小写文件系统从根目录开始,表示为一个单独的​​'/'​......
  • vue指令方式实现element table高度随浏览器和部分dom变化适应
    主要代码v-resize="resetTableHeight"//监听高度变化resetTableHeight(){//监听到searchArea高度变化使ivu-table-body高度发生改变if(document.getElements......
  • uniCloud传统方式调用数据库-基本操作
    1.后台云函数todo/index.js'usestrict';//查询所有constqueryAll=(collection,params)=>{ returncollection.get()}//新增constadd=(collection,data)=>......
  • Flask学习笔记(十七)-Memcached的基本使用
    一、Flask中使用Memcachedpipinstall-ihttps://pypi.tuna.tsinghua.edu.cn/simple--trusted-hostpypi.tuna.tsinghua.edu.cnpython-memcached安装成功以后,就可以在......
  • React进阶篇——十二、继承方式实现高阶组件
    十二、继承方式实现高阶组件前面介绍的高阶组件的实现方式都是由高阶组件处理通用逻辑,然后将相关属性传递给被包装组件,我们称这种实现方式为属性代理。除了属性代理,还可以......
  • drf-认证组件
    views.pyfromrest_framework.responseimportResponsefromrest_framework.viewsimportAPIView#局部自定义认证逻辑classMyAutheentication(object):defau......
  • element-ui el-table 开发环境 无法渲染,无法显示的问题
    其他vue项目正常,html环境正常,生产环境正常。只有开发环境无法渲染。试过切换element-ui的版本。依然没有作用。 最终排查的原因是vue.config.js下面的这段代码出......