使用element的小弹框并修改css

使用el-popover来做弹框:

滑动或点击元素要加插槽slot="reference"来展示弹框;

<el-popoverplacement="top"width="166"trigger="hover"popper-class="popover"><div><div><div><i class="iconfont icon-lianjie-01"></i><span>输入链接</span></div><div><i class="iconfont icon-gerenkongjian"></i><span>个人空间</span></div></div><div slot="reference"><i class="iconfont icon-shangchuan-copy"></i></div></div>
</el-popover>

去掉默认小三角和更改padding样式:

.popover {padding: 14px 10px 17px 10px !important;box-sizing: border-box !important;border-radius: 8px !important;
}.popover .popper__arrow {display: none !important;
}

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/19690.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

统信UOS SSH服务升级(ubuntu20)内网

服务器配置 系统信息 SSH版本 目标版本 openssh-server_8.2p1-4_arm64.deb 因为不通互联网&#xff0c;所以所有deb包需要手动下载&#xff08;可以连接互联网的可以自动忽略手动下载deb步骤&#xff0c;直接apt-get install xxx 即可&#xff09; 升级步骤 !!!deb下载方式…

Xilinx IP解析之DDS Compiler v6.0(1)—— 基础概念

前言 DDS&#xff08;Direct Digital Synthesis&#xff0c;直接数字综合器&#xff09;是一种正弦波发生器&#xff0c;在Quartus中它被称为NCO&#xff08;Numerically Controlled Oscillator&#xff0c;数控振荡器&#xff09;&#xff0c;两者是对同一功能IP核的不同称呼。…

AI数据分析:用kimi生成一个正弦波数学动画

正弦波公式: ƒ(x) a * sin(x x0) b 公式中&#xff1a; a: 决定正弦函数振动幅度的大小&#xff1b; x0:表示x开始比0拖后的弧度值&#xff1b; b&#xff1a;表示函数偏离X轴的距离&#xff1b; 对于难以理解的学生来说&#xff0c;可以用动画把这个公式直观的展现出…

3d模型移动中心点偏移太远怎么解决?---模大狮模型网

在3D建模和动画制作中&#xff0c;移动模型时确保中心点的准确性至关重要。然而&#xff0c;有时候在移动模型时&#xff0c;中心点可能会偏移得太远&#xff0c;导致操作不便甚至影响到后续的工作流程。本文将介绍在3D模型移动中心点偏移太远时的常见原因&#xff0c;并提供解…

JavaScript、Kotlin、Flutter可以开发鸿蒙APP吗?

自从去年华为宣布推出「鸿蒙Next」版本开始&#xff0c;标志着其操作系统的全面革新。鸿蒙Next将摒弃所有基于AOSP的代码&#xff0c;与Android系统彻底分离&#xff0c;实现完全自主的研发路径。通过精简约40%的冗余代码&#xff0c;鸿蒙Next致力于构建一个更高效、更流畅的系…

QWidget成员函数功能和使用详细说明(二)(文字+用例+代码+效果图)

文章目录 1.测试工程配置2.成员函数2.1 void setFixedHeight(int h)2.2 void setFixedSize(const QSize &s)2.3 void setFixedSize(int w, int h)2.4 void setFixedWidth(int w)2.5 void setFocus(Qt::FocusReason reason)2.6 void setFocusPolicy(Qt::FocusPolicy policy)…

揭秘数字货币:比特币背后的技术逻辑

随着科技的飞速发展,数字货币作为一种新兴的经济形态,已经逐渐走入我们的视野。其中,比特币无疑是这一领域的佼佼者。那么,比特币背后的技术逻辑究竟是什么呢?本文将为您揭开这一神秘面纱。 一、区块链技术:比特币的基石 比特币的核心技术就是区块链(Blockchain)。区块…

六一儿童节与AIGC:科技与童趣的奇妙融

随着人工智能生成内容&#xff08;AIGC&#xff09;技术的发展&#xff0c;越来越多的应用和网站专门为儿童提供学习、游戏和绘画方面的支持。这些平台不仅能够提高孩子们的学习兴趣&#xff0c;还能激发他们的创造力。在六一儿童节即将到来之际&#xff0c;让我们来介绍几款利…

C++的复制和拷贝构造函数

什么复制&#xff0c;看下面这个例子&#xff0c;来理解什么是复制 第一个例子 int main() {int a 2;int b a;//实际是创建一个副本&#xff0c;他俩是独立的变量&#xff0c;它们有不同的内存地址&#xff08;复制&#xff09;b 3;//是可以修改的std::cin.get();}第二个例…

03-树3 Tree Traversals Again(浙大数据结构PTA习题)

03-树3 Tree Traversals Again 分数 25 作者 陈越 An inorder binary tree traversal can be implemented in a non-recursive way with a stack. For example, suppose that when a 6-node binary tree (with the keys numbered from 1 to 6) is traversed, th…

C++ 变量类型思维导图梳理

目前了解了前端、后端&#xff0c;准备再学习一门稍微底层的语言&#xff0c;整好自己年龄也比较大了&#xff0c;学个C语言&#xff0c;等以后哪天找不到前后端的工作了&#xff0c;就去做个少儿编程老师&#xff0c;为切换赛道做准备。 1、数据类型 定义&#xff1a;给变量…

LeetCode739:每日温度

题目描述 给定一个整数数组 temperatures &#xff0c;表示每天的温度&#xff0c;返回一个数组 answer &#xff0c;其中 answer[i] 是指对于第 i 天&#xff0c;下一个更高温度出现在几天后。如果气温在这之后都不会升高&#xff0c;请在该位置用 0 来代替。 解题思想 使用单…

数字化转型对企业来说意味着什么?

数字化转型是当今社会不可避免的趋势&#xff0c;它的发展其实是多方面因素影响导致的。首先&#xff0c;随着科技的迅速发展&#xff0c;人们对于信息获取和处理的需求越来越强烈&#xff0c;这促使了各行各业都要朝着数字化方向发展。其次&#xff0c;全球化的潮流让企业需要…

【Qt秘籍】[006]-Qt 的 Hello World程序-编程第一步

"Hello,World!" 中文意思是“你好&#xff0c;世界”。 因为 The C Programming Language 中使用它做为第一个演示程序&#xff0c;后来很多程序员在学习编程或进行设备调试时延续了这一习惯。 下面&#xff0c;我们也将演示Qt中的"Hello World!" 我们先创…

【揭秘】如何借助聚道云软件连接器,实现差旅管理新飞跃!

导语&#xff1a;在当今竞争激烈的市场环境下&#xff0c;高效的差旅管理已成为企业节省成本、提升员工满意度的关键。今天&#xff0c;我们将带您看看如何通过聚道云软件连接器将易快报与阿里商旅成功对接&#xff0c;实现了差旅申请单的同步等需求&#xff0c;为企业管理带来…

Java实现数据结构---数组

文章目录 概念存储原理数组的操作完整代码 概念 数组是&#xff08;Array&#xff09;是有限个相同类型的变量所组成的有序集合&#xff0c;数组中的每一个变量为称为元素。数组是最简单、最常用的数据结构。 数组下标从零开始。 存储原理 数组用一组连续的内存空间来存储一…

文章《Causal Inference for Knowledge Graph based Recommendation》阅读

文章《Causal Inference for Knowledge Graph based Recommendation》阅读 论文概况及动机&#xff08;Introduction&#xff09;问题形式化方法论Causal Intervention (C1)Model ImplementationU()f()协同过滤部分模型优化 Causal Inference &#xff08;C2&#xff09; Exper…

Kafka生产者消息异步发送并返回发送信息api编写教程

1.引入依赖&#xff08;pox.xml文件&#xff09; <dependencies> <dependency> <groupId>org.apache.kafka</groupId> <artifactId>kafka-clients</artifactId> <version>3.6.2</version> </dependency> </depende…

伦敦金1手指的是什么?

就算没有进行过伦敦金投资&#xff0c;甚至是没有做过任何金融产品投资的朋友&#xff0c;相信也听过别人做交易决定&#xff0c;他们都是1手两手那样头买入。有些朋友就好奇了&#xff0c;这伦敦金1手指的是什么意思&#xff1f;下面我们就来讨论一下。 首先&#xff0c;如果我…

CDH6.3.2集成Flink1.12.2

一、Linux下载httpd服务并开启 yum install y httpd systemctl start httpd systemctl enable httpd 二、获取已制作好的安装包 flink-1.12.2-bin-scala_2.11.tar ​ FLINK_ON_YARN-1.12.2.jar ​ flink-shaded-hadoop-2-uber-3.0.0-cdh6.3.2-10.0.jar 三、集成CM 1.上传编…