首页 > 其他 > 详细

layUI学习第八日:按钮

时间:2020-02-04 17:52:22      阅读:83      评论:0      收藏:0      [点我收藏+]

layUI按钮:

  layUI按钮:

    <button type="button" class="layui-btn">一个标准的按钮</button>

    按钮类型:

     技术分享图片

 

   按钮 尺寸:大型:layui-btn-lg;小型; layui-btn-sm; 迷你: layui-btn-xs

  技术分享图片

 

   按钮类型 与 尺寸 组合:class=“layui-btn 按钮尺寸 按钮类型”。例如:

  技术分享图片

 

  最大化按钮

 技术分享图片

 

   圆角按钮:class="layui-btn layui-btn-radius"

  按钮类型 圆角 与尺寸组合:class="layui-btn 尺寸 layui-btn-radius 类型"。例如:

  技术分享图片

 

   按钮与图标组合

   技术分享图片

 

   结果:技术分享图片

 

   按钮组:class="layui-btn-group",按钮本身仍然可以随意搭配

   技术分享图片

 

   按钮容器:按钮在同节点并排时会自动拉开间距

  技术分享图片

 

   结果:技术分享图片

 

layUI学习第八日:按钮

原文:https://www.cnblogs.com/chenting-personal/p/12260212.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!