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.加上后,发现点击操作列的编辑按钮时,会触发按钮本身事件,同时会触发行点击事件.第一版 ...
随机推荐
- 文心一言 VS 讯飞星火 VS chatgpt (194)-- 算法导论14.3 2题
二.用go语言,改写 INTERVAL-SEARCH 的代码,使得当所有区间都是开区间时,它也能正确地工作. 文心一言,代码正常运行: 在Go语言中,处理开区间(open intervals)时,我们 ...
- C# 二十年语法变迁之 C# 2,C# 3 ,C# 4参考
C# 二十年语法变迁之 C# 2,C# 3 ,C# 4参考 https://benbowen.blog/post/two_decades_of_csharp_i/ 自从 C# 于 2000 年推出以来 ...
- P2898 [USACO08JAN] Haybale Guessing G 题解
题目传送门 前置知识 二分答案 | 并查集 解法 对条件的合法性判断其他题解已经讲得很明白了,这里不再赘述.这里主要讲一下用并查集实现黑白染色问题. 以下内容称被覆盖为黑色,不被覆盖为白色. 本题因为 ...
- NC17877 整数序列
题目链接 题目 题目描述 给出一个长度为n的整数序列 \(a_1,a_2,...,a_n\) ,进行 \(m\) 次操作,操作分为两类. 操作1:给出 \(l,r,v\) ,将 \(a_l,a_{l+ ...
- 2023sdut_python实验
7-1 sdut-温度转换 n = input() n = float(n) c = 5.0*(n-32.0)/9.0 print("%.2f" %(c)) #其中,c为变量 ...
- 贝壳云P1刷机记录(5.10内核Armbian)
说明 贝壳云基于瑞芯微的RK3328芯片, 芯片介绍, Cortex-A53架构, 4核, 1G内存, 8G eMMC. 板载1个千兆网口, 4个USB3.0. 这个盒子比较赞的地方就是不到百元的价格 ...
- QT C++工程CI环境笔记
开发环境 Ubuntu18.04 or Ubuntu20.04 Qt Creator 4.6.x (Based on Qt 5.11.x) APT list: apt-transport-https ...
- centos7使用repo方式安装zabbix4.0
1.安装zabbix的repo源 rpm -ivh https://mirrors.tuna.tsinghua.edu.cn/zabbix/zabbix/4.0/rhel/7/x86_64/zabbi ...
- Oracle如何限制非法调用包中过程
原文:http://www.oracle.com/technetwork/issue-archive/2015/15-jan/o15plsql-2398996.html 假如我有一个包P_A,其中封装 ...
- junit使用mock objects进行单元测试
上一篇我介绍了使用stub进行单元测试.那么mock objects和stub有何区别?什么情况下使用mock objects呢? 下面摘自junit in action书中的解释: mock obj ...