链接状态的按钮 html,Element-UI之组件按钮与链接

element中按钮比较丰富

Button 按钮

基础用法

使用type、plain、round和circle属性来定义 Button 的样式

默认按钮

主要按钮

成功按钮

信息按钮

警告按钮

危险按钮

主要按钮

主要按钮

8091279fcf62ee2f5a05ddcb4391f1d0.png

你可以使用disabled属性来定义按钮是否可用,它接受一个Boolean值。

119ef9296f735c99b7a711ec1ac13d96.png

d382f14ed42774861efabd7879e51ea4.png

注意: 给元素绑定disabled属性可以控制禁用或非禁用(true为禁用,false为非禁用)

4088c392055f49c5c5ead1ca72e66213.png

图标按钮

efc7899111ce4ac9584b77c6a377c769.png

设置icon属性即可,icon 的列表可以参考 Element 的 icon 组件,也可以设置在文字右边的 icon ,只要使用i标签即可,可以使用自定义图标。

按钮组

0d7911eb17c203353989e5cd5591c587.png

使用< el-button-group >标签来嵌套你的按钮。

上一页

下一页

加载中按钮

d24afa44b04514d41daea7f357e2f001.png

要设置为 loading 状态,只要设置loading属性为true即可。

加载中

设成false后不再旋转,图标消失

Link 文字链接

基础用法

4086c83280ccd8732235546bce142b8c.png

默认链接

主要链接

成功链接

警告链接

危险链接

信息链接

禁用状态

929208c9ca01a0a4e68c9d39b17a66ec.png

2b9fc78f620e2fe13c32ae3a78b43d8d.png

下划线

2dc6a7b669b73721961b3ac918bd67a9.png

图标

9fbed97f2d99fc8d209dbccbe649c648.png

3243aa1822c6de4977af5e2c35f674bb.png

标签:属性,禁用,Element,UI,按钮,icon,链接,图标

来源: https://blog.csdn.net/crazyFengGan/article/details/94445390

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值