当前位置: 首页 > news >正文

el-descriptions-item使用span占行不生效

需要实现的效果是客户状态单独占满一行


错误代码:

<el-descriptions title="基本信息" :column="3">
<el-descriptions-item label="公司电话:">Suzhou</el-descriptions-item><el-descriptions-item label="批次号:">Suzhou</el-descriptions-item><el-descriptions-item label="借款笔数:">Suzhou</el-descriptions-item><el-descriptions-item label="放款时间:">Suzhou</el-descriptions-item><el-descriptions-item label="放款金额:">Suzhou</el-descriptions-item><el-descriptions-item :span="3" label="客户状态:"><el-tag size="small">School</el-tag></el-descriptions-item>
</el-descriptions>

使用span是没有错的,但是用错了位置,出来的效果就是这样


如图可见客户状态已经是在当前行最后一个的位置,那么直接给他设置span是不会生效的,所以要从前面一个元素下手,让放款金额这个元素提前占满2个位置,才可以让客户状态向下排

正确代码:

<el-descriptions title="基本信息" :column="3">
<el-descriptions-item label="公司电话:">Suzhou</el-descriptions-item><el-descriptions-item label="批次号:">Suzhou</el-descriptions-item><el-descriptions-item label="借款笔数:">Suzhou</el-descriptions-item><el-descriptions-item label="放款时间:">Suzhou</el-descriptions-item><el-descriptions-item :span="2" label="放款金额:">Suzhou</el-descriptions-item><el-descriptions-item :span="3" label="客户状态:"><el-tag size="small">School</el-tag></el-descriptions-item>
</el-descriptions>

只需要在上一个元素上面加上:span="2"就可以了

相关文章:

el-descriptions-item使用span占行不生效

需要实现的效果是客户状态单独占满一行 错误代码&#xff1a; <el-descriptions title"基本信息" :column"3"> <el-descriptions-item label"公司电话:">Suzhou</el-descriptions-item><el-descriptions-item label"…...

Android 绘制学习总结

1、刷新率介绍 我们先来理一下基本的概念&#xff1a; 1、60 fps 的意思是说&#xff0c;画面每秒更新 60 次 2、这 60 次更新&#xff0c;是要均匀更新的&#xff0c;不是说一会快&#xff0c;一会慢&#xff0c;那样视觉上也会觉得不流畅 3、每秒 60 次&#xff0c;也就是 1…...

Linux下部署SSM项目

作者主页&#xff1a;舒克日记 简介&#xff1a;Java领域优质创作者、Java项目、学习资料、技术互助 文中获取源码 Linux部署SSM项目 打包项目 1、修改pom.xml文件&#xff0c;打包方式改为war <packaging>war</packaging>2、idea 通过maven的clean&#xff0c;…...

计算机网络 笔记 数据链路层 2

1,信道划分&#xff1a; (1)时分复用TDM 将时间等分为“TDM帧”&#xff0c;每个TDM帧内部等分为m个时隙&#xff0c;m个用户对应m个时隙 缺点&#xff1a;每个节点只分到了总带宽的1/m,如果有部分的1节点不发出数据&#xff0c;那么就会在这个时间信道被闲置&#xff0c;利用…...

xml简介

目录 基本语法特点及应用场景一个简单示例 xml&#xff08;全称eXtensible Markup Language&#xff09;是一种用于存储和传输数据的标记语言&#xff0c;跨平台并且跨语言&#xff0c;xml内容较多&#xff0c;这篇文章会介绍一些基础的内容。 基本语法 xml文档通常以xml声明开…...

透明部署、旁路逻辑串联的区别

背景 需讨论防火墙到底是串联&#xff0c;还是旁挂。 通常串联指的就是“透明部署”&#xff0c;旁挂指的就是“逻辑串联”。 透明部署&#xff08;串联&#xff09; 也称为透明模式或桥接模式&#xff0c;是一种安全设备的部署方式。在这种模式下&#xff0c;安全设备被串联…...

【网络安全渗透测试零基础入门】之XSS攻击获取用户cookie和用户密码(实战演示)

前言 大家好&#xff0c;我是demon 这是demon给粉丝盆友们整理的网络安全渗透测试入门阶段XSS攻击教程。 本阶段主要讲解XSS攻击获取用户cookie和用户密码。 喜欢的朋友们&#xff0c;记得给晓晓点赞支持和收藏一下&#xff0c;关注我&#xff0c;学习黑客技术。 简介 该…...

c#版本、.net版本、visual studio版本之间的对应关系

最近这几年一直没用过c#开发&#xff0c;都是从事Qt c开发工作&#xff0c;回想一下之前c#还要追溯到2019年&#xff0c;算算时间大概都已过去4&#xff0c;5年了&#xff0c;时间飞快。 2019真是个神奇的数字&#xff0c;vs2019是我用的时间最长的一个IDE&#xff0c;新冠起始…...

熵与交叉熵:从不确定性角度理解 KL 散度

从不确定性减少视角理解KL散度 【 Transformer 系列&#xff0c;故事从 d k \sqrt{d_k} dk​ ​说起】 LLM这么火&#xff0c;Transformer厥功甚伟&#xff0c;某天心血来潮~&#xff0c;再去看看&#xff01; 它长这个样子&#xff1a; 深入浅出 Transformer 看完后&#xff…...

Redis:数据类型

1. 字符串&#xff08;String&#xff09; 简介 概念&#xff1a;这是最简单的数据类型&#xff0c;可以存储字符串、整数或浮点数。特点&#xff1a;支持原子操作&#xff0c;如递增和递减数值。 示例 # 设置一个键值对 SET mykey "Hello, Redis!"# 获取该键的值…...

搭建Node.js后端

从头开始搭建一个Node.js后端&#xff0c;并实现查询历史数据的功能&#xff0c;下面是详细的步骤说明&#xff0c;包括环境配置、项目初始化、代码编写、以及服务器启动。 1. 环境配置 1.1 安装 Node.js 和 npm 首先&#xff0c;你需要在你的电脑上安装 Node.js 和 npm&…...

集合——数据结构

数据结构 就是计算机存储数据的方式。 不同情况下采取不同数据结构会让数据查找&#xff0c;存储更加有效率。 栈...

从CentOS到龙蜥:企业级Linux迁移实践记录(系统安装)

引言&#xff1a; 随着CentOS项目宣布停止维护CentOS 8并转向CentOS Stream&#xff0c;许多企业和组织面临着寻找可靠替代方案的挑战。在这个背景下&#xff0c;龙蜥操作系统&#xff08;OpenAnolis&#xff09;作为一个稳定、高性能且完全兼容的企业级Linux发行版&#xff0…...

《机器学习》——支持向量机(SVM)

文章目录 什么是支持向量机&#xff1f;基本原理数学模型 支持向量机模型模型参数属性信息 支持向量机实例&#xff08;1&#xff09;实例步骤读取数据可视化原始数据使用支持向量机训练可视化支持向量机结果完整代码 支持向量机实例&#xff08;2&#xff09;实例步骤导入数据…...

【PPTist】公式编辑、插入音视频、添加动画

一、插入公式 点击公式的时候 latexEditorVisible 会变成 true src/views/Editor/CanvasTool/index.vue <Modalv-model:visible"latexEditorVisible" :width"880" ><LaTeXEditor close"latexEditorVisible false"update"data &…...

LeetCode - #186 翻转字符串里的单词 II(会员题)

网罗开发 &#xff08;小红书、快手、视频号同名&#xff09; 大家好&#xff0c;我是 展菲&#xff0c;目前在上市企业从事人工智能项目研发管理工作&#xff0c;平时热衷于分享各种编程领域的软硬技能知识以及前沿技术&#xff0c;包括iOS、前端、Harmony OS、Java、Python等…...

Kafka核心参数与使用02

一、从基础的客户端说起 Kafka 提供了非常简单的生产者&#xff08;Producer&#xff09;和消费者&#xff08;Consumer&#xff09;API。通过引入相应依赖后&#xff0c;可以快速上手编写生产者和消费者的示例。 1. 消息发送者主流程 一个最基础的 Producer 发送消息的步骤…...

Three.js 渲染技术:打造逼真3D体验的幕后功臣

文章目录 前言一、着色器&#xff08;Shaders&#xff09;二、后处理&#xff08;Post-processing&#xff09;三、抗锯齿&#xff08;Anti-aliasing&#xff09;四、实时渲染与离线渲染五、光照模型与材质优化六、环境映射&#xff08;Environment Mapping&#xff09;七、纹理…...

QTcpSocket 如何统计在线时长

基本原理 QTcpSocket是 Qt 库中用于 TCP 通信的类。要统计在线时长,关键思路是记录连接建立的时间和当前时间,通过计算两者的差值来得到在线时长。实现步骤 记录连接建立时间: 在连接成功的信号槽函数中记录开始时间。例如,当QTcpSocket成功连接到服务器时,会发出connecte…...

【Altium】AD使用智能粘贴功能把多个网络标签改成端口

1、 文档目标 使用智能粘贴功能把多个网络标签&#xff08;net lable&#xff09;改成端口&#xff08;port&#xff09; 2、 问题场景 客户有一份原理图&#xff0c;网络用的是net label&#xff0c;没用Port&#xff0c;然后创建一个sheet symbol&#xff0c;但是sheet sy…...

量子化学计算中的自旋适应算符与费米子激发算符

1. 量子化学计算中的自旋适应算符基础在量子化学模拟领域&#xff0c;保持电子波函数的自旋对称性是一个根本性挑战。传统计算方法中&#xff0c;我们使用Slater行列式来表示多电子波函数&#xff0c;这种方法虽然直观&#xff0c;但无法保证波函数是总自旋算符Ŝ的本征态。自旋…...

Person Blocker实战教程:10个创意用例教你玩转图片遮挡

Person Blocker实战教程&#xff1a;10个创意用例教你玩转图片遮挡 【免费下载链接】person-blocker Automatically "block" people in images (like Black Mirror) using a pretrained neural network. 项目地址: https://gitcode.com/gh_mirrors/pe/person-block…...

迷宫算法避坑指南:为什么你的‘流水算法’跑不出最短路径?(附Python调试技巧)

迷宫算法避坑指南&#xff1a;为什么你的‘流水算法’跑不出最短路径&#xff1f;&#xff08;附Python调试技巧&#xff09; 迷宫寻路算法一直是编程学习者和算法爱好者热衷探索的领域。其中&#xff0c;流水算法因其独特的物理模拟思路而备受关注。但在实际实现过程中&#x…...

网络安全有哪些岗位?如何成为一名优秀的网络安全工程师?

网络安全有哪些岗位&#xff1f;如何成为一名优秀的网络安全工程师&#xff1f; 网络安全是什么&#xff1f; 首先说一下什么是网络安全&#xff1f;其中&#xff0c;网络安全工程师工作内容具体有哪些&#xff1f; 网络安全 确保网络系统的硬件、软件及其系统中的数据受到保护…...

告别折腾:用 apt 和 Qt 官方安装器两种方式在 Debian 上搞定 Qt 5.15.2 开发环境

在 Debian 上搭建 Qt 5.15.2 开发环境的双轨方案 对于需要在 Debian 系统上建立 Qt 开发环境的工程师来说&#xff0c;选择正确的安装方式往往比安装本身更重要。本文将深入探讨两种主流方案&#xff1a;Debian 官方仓库的 apt 安装和 Qt 官方在线安装器&#xff0c;帮助您根据…...

企业级AI Agent实战:如何解决异常考勤处理滞后与薪资核算难题?

摘要&#xff1a; 在2026年企业数字化转型步入深水区的今天&#xff0c;考勤管理与薪资核算的脱节已成为制约组织效能的隐形枷锁。作为一名在企业架构领域摸爬滚打15年的架构师&#xff0c;我观察到无数企业陷入“异常考勤处理滞后、员工满意度低、薪资核算频错”的恶性循环。传…...

从一次线上故障复盘:如何用 nlohmann::json 的 `value()` 和 `get_to()` 优雅处理缺失字段

从一次线上故障复盘&#xff1a;如何用 nlohmann::json 的 value() 和 get_to() 优雅处理缺失字段 上周五晚上10点&#xff0c;我们的算法服务平台突然收到大量错误告警。一个核心接口在解析上传的算法包时频繁报错&#xff0c;日志里满是[json.exception.type_error.302] type…...

压接 vs 焊接:高速连接器组装工艺的选型指南与实战对比

摘要/前言在通信设备、工业控制及数据中心硬件设计中&#xff0c;连接器的组装工艺选择直接影响产品的可靠性、可维护性与生产良率。压接&#xff08;Press-Fit&#xff09;与焊接&#xff08;Soldering&#xff09;是当前通孔连接器最主要的两种电气互连方式。压接依靠过盈配合…...

【量化】IPTQ-ViT: Post-Training Quantization of Non-linear Functions for Integer-only Vision Transformer

【PTQ】PTQViT/IPTQ-ViT (arXiv 2022) 问题: ViT 中的非线性函数&#xff08;GELU、Softmax&#xff09;在纯整数推理中存在计算障碍。 核心创新: 模块方法作用多项式近似 GELU用低阶多项式逼近 GELU将非线性运算转化为整数可执行的乘加Bit-shifting Softmax用位移操作近似 …...

别再乱用sudo了!麒麟KYLINOS下用ACL实现安全的精细化权限控制

麒麟KYLINOS权限管理革命&#xff1a;用ACL替代sudo的精细化控制实战 在麒麟KYLINOS操作系统中&#xff0c;许多管理员习惯性地使用sudo或简单粗暴的chmod 777来解决权限问题&#xff0c;这种"一刀切"的做法实际上为系统安全埋下了重大隐患。想象一下这样的场景&…...