css class 操作列 按钮 之间加 竖线 | class="your-handleBtn" :last-child::after
思路:botton 加一个class 每个右边加个竖线,最后一个不加。
用起来很方便
<template slot="handle"
slot-scope="{ row, index }">
<Button type="primary"
v-if="row.parentItemId === '0'"
ghost
class="your-handleBtn"
@click="newSubHandle(row,index)">新增子项</Button>
<Button type="primary"
ghost
class="your-handleBtn"
@click="modifyHandle(row,index)">编辑</Button>
<Button type="error"
ghost
@click="deleteHandle(row,index)"
class="your-handleBtn">删除</Button>
</template>
.your-handleBtn{
position: relative;
display: inline-block !important;
padding: 4px 9px !important;
border:0 !important;
}
.your-handleBtn::after {
position: absolute;
content: '';
display: block;
width: 1px;
height: 16px;
top: 8px;
right: -1px;
background: #E5E5E5;
}
.your-handleBtn:last-child::after {
display: none;
}
css class 操作列 按钮 之间加 竖线 | class="your-handleBtn" :last-child::after的更多相关文章
- 只用css实现“每列四行,加载完一列后数据自动填充到下一列”的效果
只用css实现“每列四行,加载完一列后数据自动填充到下一列”的效果.这个题目用图表示如下: 如果将题目换成“只用css实现每行四列,加载完一行后数据自动填充到下一行”,那这个问题就简单多了,相信大家都 ...
- WPF中使用DataGrid时操作列按钮问题
在使用DataGrid的过程中,我们有时候需要对选取的某一行数据进行多个操作,这个时候操作列只有一个按钮显然无法满足我们的要求,我们需要多个按钮才能达到我们的目的. UI页面代码: <Grid& ...
- WPF datagrid 列按钮使用
原文:WPF中使用DataGrid时操作列按钮问题 <DataGrid x:Name="datagrid" AutoGenerateColumns="Fal ...
- easyui datagrid自定义按钮列,即最后面的操作列(转)
做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式 ...
- easyui datagrid自定义按钮列,即最后面的操作列
在很多时候我们要在表格的最后添加一列操作列,easyUI貌似没有提供种功能,不过没关系,我们可以自定义来实现首先是HTML部分 <table id="tt" class=&q ...
- ajax基础语法、ajax做登录、ajax做用户名验证是否可用、ajax做关键字查询动态显示、ajax做用表格显示数据并增加操作列
AJAX: AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ...
- CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器
CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...
- 前端基础:CSS属性操作
CSS属性操作 1.文本 文本颜色:color,颜色属性被用来设置文字的颜色,颜色是通过CSS经常指定的,其格式有: 1.十六进制:#FF0000: 2.RGB值:RGB(255,0,0): 3.颜色 ...
- 前端基础-CSS属性操作
前端基础-CSS属性操作 css text 文本颜色:color 颜色属性被用来设置文字的颜色. 颜色是通过CSS最经常的指定: 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB( ...
- el-table行点击事件row-click与列按钮事件冲突
需求简述 表格用el-table实现,操作列的编辑按钮点击事件正常实现.现要为行加一点击事件,即row-click.加上后,发现点击操作列的编辑按钮时,会触发按钮本身事件,同时会触发行点击事件.第一版 ...
随机推荐
- Linux-计算毫秒数
date +%s返回自划时代以来的秒数. date +%s%N返回秒数+当前纳秒数. 因此,echo $(($(date +%s%N)/1000000))是你需要的毫秒数 date +"%T ...
- 函数防抖与节流 - js
防抖(debounce)和节流(throttle)是在 高频次调用函数 的场景下,常用的解决方案了.故名思意,可以节省开销,优化体验. 二者的区别: 防抖: 我们让想要执行的函数只在最后一次调用完一小 ...
- react 八千字长文深入了解react合成事件底层原理,原生事件中阻止冒泡是否会阻塞合成事件?
壹 ❀ 引 在前面两篇文章中,我们花了较大的篇幅介绍react的setState方法,在介绍setState同步异步时提到,在react合成事件中react对于this.state更新都是异步,但在原 ...
- NC16122 郊区春游
题目链接 题目 题目描述 今天春天铁子的班上组织了一场春游,在铁子的城市里有n个郊区和m条无向道路,第i条道路连接郊区Ai和Bi,路费是Ci.经过铁子和顺溜的提议,他们决定去其中的R个郊区玩耍(不考虑 ...
- Oracle正则表达式实战
原文链接:http://oracle-base.com/articles/misc/regular-expressions-support-in-oracle.php Introduction Exa ...
- spring boot整合poi实现excel文件导入导出实战
今天科比离去,今天肺炎病毒持续肆虐... 意识到生命的脆弱,今天我继续前行,比以往更加坚定和紧迫,这辈子不活好自己就算白来一趟. 1.项目介绍 最近帮朋友做了一个小工具,就是实现:上传一个excel文 ...
- spring boot整合dubbo
本项目通过模拟卖票和买票模块来讲解spring boot如何整合dubbo. 1.搭建zookeeper 使用docker方式: docker pull registry.docker-cn.com/ ...
- centos7下修改mysql5.5字符集
1.查看现有数据库编码 show variables like "%char%"; 2.修改mysql配置文件:/etc/my.cnf(以实际安装环境为准) 在[client]字段 ...
- 工作中常用HTML知识点整理
1.table相关样式 border:设置表格边框大小cellspacing:设置单元格间距cellpadding:设置单元格边界与单元格内容间距border-collapse:设置表格的边框是否被合 ...
- 《深入理解Java虚拟机》(二) GC 垃圾回收机制
@ 目录 一.概述 二.判断对象是否需要被回收方式 1.引用计数法: 2.可达性分析法: 三.垃圾收集算法 1.分代收集理论基础 2.标记-清除算法 3.复制-收集算法 4.标记-压缩(整理)算法 5 ...