SAAS系统后台样式1.0.0

页面 操作按钮

// 创建、新增类按钮:

// 需跳转, 可使用 nuxt 标签追加class名  btn-add
<nuxt-link class="btn-add" to="/created">新增</nuxt-link>
// 非跳转可使用
<el-button  type="primary"></el-button>
// 或
<a class="btn-add" href="javascript:void(0);">编辑</a>

// 编辑、更新类按钮:

// 需跳转, 可使用 nuxt 标签追加class名  btn-update
<nuxt-link class="btn-update to="/update">编辑</nuxt-link>
//非跳转可使用
<el-button  type="success"></el-button>
// 或
<a class="btn-update" href="javascript:void(0);">编辑</a>

// 删除类按钮:

// 需跳转, 可使用 nuxt 标签追加class名   btn-del
<nuxt-link class="btn-del" to="/update">编辑</nuxt-link>
//非跳转可使用
<el-button  type="danger"></el-button>
// 或
<a class="btn-del" href="javascript:void(0);">编辑</a>

// 搜索类按钮

<el-button type="primary" icon="el-icon-search">搜索</el-button>  // 如跳转 请追加@click事件

// 其他类按钮
<el-button>打印</el-button>  // 如跳转 请追加@click事件

table 列表按钮

// 删除、导出按钮

// 需跳转 请直接使用 nuxt 标签进行跳转  添加class名  red
<nuxt-link class="red" to="/1">查看</nuxt-link>
// 非跳转  
<a class="red" href="javascript:void(0);">查看</a>

// 其他 

// 需跳转
<nuxt-link to="/1">查看</nuxt-link>
//非跳转
<a href="javascript:void(0);">查看</a>

按钮 与列表间距 10px
相邻按钮之间相距 10px

相邻块之间间距 10px

table列无特殊要求,尽量不要出现横向滚动条
table悬浮列尽可能 不要超过200px

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,964评论 1 45
  • Bootstrap是什么? 一套易用、优雅、灵活、可扩展的前端工具集--BootStrap。GitHub上介绍 的...
    凛0_0阅读 13,726评论 3 184
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 8,566评论 0 5
  • day01­_起源和结构 结构:Xhtml xml 表现:CSS 行为:DOM ECMAScript 以上都属于W...
    Sakura_明妃阅读 4,976评论 0 1