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

VUE div的右上角的角标/标签

news 2025/9/14 19:12:20

一、效果图

二、代码

<div class="comp-overview"><div class="overview-item" v-for="(item,index) in overviewInfoList" :key="index"><div class="angle_mark"><span>{{item.label}}</span></div><div class="home-chart-title"><span>{{item.title}}</span></div></div>
</div>

.overview-item {//父容器position: relative;display: inline-block;width: 32.6%;color: #7c979e;font-size: 16px;margin-right: 1%;margin-bottom: 18px;height: 206px;border-radius: 4px;background: #FFFFFF;border: 1px solid rgba(136, 136, 136, 0.1);padding: 20px 17px 0;// 角标.angle_mark {position: absolute;top: 0;right: 0;width: 58px;height: 25px;border-radius: 0 3px 0 4px;background: rgba(52, 117, 235, 0.1);// 角标文字span {position: absolute;display: inline-block;width: 100%;text-align: center;font-family: 思源黑体;font-size: 12px;font-weight: normal;line-height: 25px;color: #3475EB;}}
}

相关文章：

VUE div的右上角的角标/标签

一、效果图 二、代码 <div class"comp-overview"><div class"overview-item" v-for"(item,index) in overviewInfoList" :key"index"><div class"angle_mark"><span>{{item.label}}</span>&…...

编程日记 2024/6/26 5:34:53

WPS复制后转置粘贴

1. WPS复制后转置粘贴 复制-》右键-》顶部第一行-》粘贴行列转置&#xff0c;如下图&#xff1a; 2. Excel office365 本地版 2. Excel office365 在线版...

编程日记 2024/6/26 5:33:52

Shell编程之正则表达式与文本处理器

一&#xff0c;正则表达式 1&#xff1a;正则表达式概述 1.正则表达式的定义 正则表达式&#xff08;Regular Expression&#xff0c;RegEx&#xff09;是一种高度灵活的文本处理工具&#xff0c;它结合了字符序列、特殊控制字符&#xff08;称为元字符&#xff09;、以及特定…...

编程日记 2024/6/26 5:26:44

linux文本粘贴格式错乱的问题

vi/vim :set paste然后再 insert, 粘贴...

编程日记 2024/6/26 5:25:43

第二节课 6月13日 ssh密钥登陆方式

centos和ubuntu openssh服务的初始安装 一、实验&#xff1a;ubuntu系统激活root用户 ubuntu系统如何激活root用户&#xff0c;允许root用户ssh登陆&#xff1f; 1、ubuntu默认root用户未设置密码&#xff0c;未激活 激活root用户&#xff0c;设置root密码 sudo passwd roo…...

编程日记 2024/6/26 5:23:39

图书馆借阅表

DDL 用户表 (Users) 图书表 (Books) 图书类别表 (BookCategories) 图书与类别关联表 (BookCategoryRelations) 借阅记录表 (BorrowRecords) 供应商表 (Suppliers) 采购记录表 (PurchaseRecords) CREATE TABLE Users (user_id INT PRIMARY KEY AUTO_INCREMENT,username …...

编程日记 2024/6/26 5:20:36

云动态摘要 2024-06-25

给您带来云厂商的最新动态&#xff0c;最新产品资讯和最新优惠更新。 最新产品更新 Web应用防火墙 - 验证码支持微信小程序接入 阿里云 2024-06-25 支持客户从微信小程序场景下接入&#xff0c;提供人机识别的安全防护。 工业数字模型驱动引擎 - iDME控制台换新升级 华为云…...

编程日记 2024/6/26 5:16:32

Docker编译nanopc-t4源码流程介绍

官方文档 Android系统编译 vnc加环境变量配置 https://github.com/friendlyarm/docker-cross-compiler-novnc 下载 git clone https://github.com/friendlyarm/docker-ubuntu-lxde-novnc cd docker-ubuntu-lxde-novnc docker build --no-cache -t docker-ubuntu-lxde-novnc …...

编程日记 2024/6/26 5:15:30

Redis八股文目录

Redis缓存穿透-CSDN博客 Redis缓存击穿-CSDN博客 Redis缓存雪崩&#xff08;主从复制、哨兵模式&#xff08;脑裂&#xff09;、分片集群&#xff09;-CSDN博客 Redis双写一致性-CSDN博客 Redis持久化-CSDN博客 Redis数据过期、淘汰策略-CSDN博客 分布式锁&#xff08;Re…...

编程日记 2024/6/26 5:14:27

Ext JS+Spring Boot 使用Ajax方式上传文件

实现方式 使用 Ext JS 进行 AJAX 调用以传递文件通常涉及到创建一个 FormData 对象，将文件附加到这个对象中，然后通过 Ext JS 的 AJAX API 发送这个对象。 基本步骤 以下是使用 Ext JS 发送文件的基本步骤： 准备文件和数据: 首先需要获取到要传递的文件 创建 FormData 对…...

编程日记 2024/6/26 5:12:25

windows桌面运维----第九天

1、新的电脑需要安装哪些驱动&#xff1a; 显卡驱动、声卡驱动、主板驱动、网卡驱动、打印机驱动、外设驱动、 2、网络打印机如何开启打印机共享核客户端连接共享打印机&#xff1a; 一、打开控制面板并定位到设备和打印机&#xff1a; 首先&#xff0c;我们在电脑桌面上找…...

编程日记 2024/6/26 5:09:22

【Docker】安装和加速

目录 1.安装 2.了解 docker 信息 3.查询状态 4. 重新启动Docker 1.安装 yum install –y docker 2.了解 docker 信息 cat /etc/redhat-release 3.查询状态 systemctl status docker 4.支持 1.12 的 docker 镜像加速 sudo mkdir -p /etc/docker sudo tee /etc/docke…...

编程日记 2024/6/26 5:08:19

如何关闭win10音量调节时 左上角出现的黑框

目录 1.谷歌浏览器&#xff1a; 2.edge浏览器&#xff1a; 3.没得办法的办法&#xff1a; 4.官方回复&#xff1a; 1.谷歌浏览器&#xff1a; 把这行地址chrome://flags/#hardware-media-key-handling 输入到chrome的地址栏里&#xff0c;回车&#xff0c;把黄色里的Hardwa…...

编程日记 2024/6/26 5:05:15

准确率（accuracy）、召回率（recall）的意义和区别

准确率&#xff08;accuracy&#xff09;、召回率&#xff08;recall&#xff09;的意义和区别 对于准确率和召回率&#xff1a;一句话&#xff0c;准确率就是“找的对”&#xff0c;召回率就是“找的全” &#xff08;精确率&#xff1a;正样本中找对的准确率&#xff09; 注…...

编程日记 2024/6/26 5:03:13

分享5个卫星影像查看网站

我们在《分享5个图源二维码及使用方法》一文中&#xff0c;为你分享了5个图源二维码。 现在再为你为分享5种在线卫星影像&#xff0c;如果你需要更多的图源二维码&#xff0c;请在文末查看领取方式。 MapBox卫星影像 可能很多人都知道MapBox的地名路网地图&#xff0c;但可能…...

编程日记 2024/6/26 5:02:12

37岁，被裁员，失业三个月，被面试官嫌弃“太水”：就这也叫10年以上工作经验？

今年部门要招两个自动化测试&#xff0c;这几个月我面试了几十位候选人。发现一个很奇怪的现象&#xff0c;面试中一问到元素定位、框架api、脚本编写之类的&#xff0c;很多候选人都对答如流。但是一问到实际项目&#xff0c;比如“项目中UI自动化和接口自动化如何搭配使用&am…...

编程日记 2024/6/26 5:00:09

如何选择一款优质的酱香酒？

很多人在评价一款酒的好坏时&#xff0c;往往只关注一个标准&#xff1a;口感是否顺滑。然而&#xff0c;真正品鉴一款酒的品质&#xff0c;首要的是香味&#xff0c;其次是味道&#xff0c;最后才是岁月带来的柔和。这种由岁月赋予的柔和&#xff0c;才能展现出酒的力量感和层…...

编程日记 2024/6/26 4:52:00

SQL Server数据库安装

原文&#xff1a;https://blog.c12th.cn/archives/26.html SQL Server数据库安装 测试&#xff1a;笔记本原装操作系统&#xff1a;Windows 10 家庭中文版 资源分享链接&#xff1a;提取码&#xff1a;qbt2 注意事项&#xff1a; 请严格按照步骤安装&#xff0c;SQL软件安装较…...

编程日记 2024/6/26 4:48:57

Hadoop 面试题（十）

1. 简述下列关于Hadoop命令中&#xff0c;命令执行成功返回0&#xff0c;执行失败返回-1&#xff0c;下列命令返回-1的是 &#xff1f; A&#xff1a;hadoop fs -mv /user/hadoop/file1 /user/hadoop/file2 B&#xff1a;hdfs dfs -mv hdfs:///testData file:///tmp/testData …...

编程日记 2024/6/26 4:47:56

Python网络安全项目开发实战，如何看清Web攻击

注意：本文的下载教程，与以下文章的思路有相同点，也有不同点，最终目标只是让读者从多维度去熟练掌握本知识点。 下载教程： Python网络安全项目开发实战_看清Web攻击_编程案例解析实例详解课程教程.pdf 一、引言 在网络安全领域，Web攻击一直是一个严峻的问题。攻击者通过各…...

编程日记 2024/6/26 4:45:53

华为云AI开发平台ModelArts

华为云ModelArts&#xff1a;重塑AI开发流程的“智能引擎”与“创新加速器”&#xff01; 在人工智能浪潮席卷全球的2025年&#xff0c;企业拥抱AI的意愿空前高涨&#xff0c;但技术门槛高、流程复杂、资源投入巨大的现实&#xff0c;却让许多创新构想止步于实验室。数据科学家…...

编程新知 2025/9/14 9:58:57

React 第五十五节 Router 中 useAsyncError的使用详解

前言 useAsyncError 是 React Router v6.4 引入的一个钩子&#xff0c;用于处理异步操作&#xff08;如数据加载&#xff09;中的错误。下面我将详细解释其用途并提供代码示例。 一、useAsyncError 用途 处理异步错误&#xff1a;捕获在 loader 或 action 中发生的异步错误替…...

编程新知 2025/9/1 12:53:45

golang循环变量捕获问题​​

在 Go 语言中&#xff0c;当在循环中启动协程&#xff08;goroutine&#xff09;时&#xff0c;如果在协程闭包中直接引用循环变量&#xff0c;可能会遇到一个常见的陷阱 - ​​循环变量捕获问题​​。让我详细解释一下&#xff1a; 问题背景 看这个代码片段&#xff1a; fo…...

编程新知 2025/7/5 11:03:11

Maven 概述、安装、配置、仓库、私服详解

目录 1、Maven 概述 1.1 Maven 的定义 1.2 Maven 解决的问题 1.3 Maven 的核心特性与优势 2、Maven 安装 2.1 下载 Maven 2.2 安装配置 Maven 2.3 测试安装 2.4 修改 Maven 本地仓库的默认路径 3、Maven 配置 3.1 配置本地仓库 3.2 配置 JDK 3.3 IDEA 配置本地 Ma…...

编程新知 2025/9/7 8:50:41

代理篇12|深入理解 Vite中的Proxy接口代理配置

在前端开发中，常常会遇到 跨域请求接口 的情况。为了解决这个问题，Vite 和 Webpack 都提供了 proxy 代理功能，用于将本地开发请求转发到后端服务器。 什么是代理（proxy）？ 代理是在开发过程中，前端项目通过开发服务器，将指定的请求“转发”到真实的后端服务器，从而绕…...

编程新知 2025/9/13 13:10:12

网站指纹识别

网站指纹识别 网站的最基本组成&#xff1a;服务器&#xff08;操作系统&#xff09;、中间件&#xff08;web容器&#xff09;、脚本语言、数据厍 为什么要了解这些&#xff1f;举个例子&#xff1a;发现了一个文件读取漏洞&#xff0c;我们需要读/etc/passwd&#xff0c;如…...

编程新知 2025/9/2 18:41:56

Web中间件--tomcat学习

Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机&#xff0c;它可以执行Java字节码。Java虚拟机是Java平台的一部分&#xff0c;Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...

编程新知 2025/9/13 18:20:34

Spring AI Chat Memory 实战指南：Local 与 JDBC 存储集成

一个面向 Java 开发者的 Sring-Ai 示例工程项目&#xff0c;该项目是一个 Spring AI 快速入门的样例工程项目&#xff0c;旨在通过一些小的案例展示 Spring AI 框架的核心功能和使用方法。 项目采用模块化设计&#xff0c;每个模块都专注于特定的功能领域&#xff0c;便于学习和…...

编程新知 2025/7/28 10:33:30

HybridVLA——让单一LLM同时具备扩散和自回归动作预测能力：训练时既扩散也回归，但推理时则扩散

前言 如上一篇文章《dexcap升级版之DexWild》中的前言部分所说&#xff0c;在叠衣服的过程中&#xff0c;我会带着团队对比各种模型、方法、策略&#xff0c;毕竟针对各个场景始终寻找更优的解决方案&#xff0c;是我个人和我司「七月在线」的职责之一 且个人认为&#xff0c…...

编程新知 2025/9/6 22:29:50

智能职业发展系统：AI驱动的职业规划平台技术解析

智能职业发展系统&#xff1a;AI驱动的职业规划平台技术解析 引言&#xff1a;数字时代的职业革命 在当今瞬息万变的就业市场中&#xff0c;传统的职业规划方法已无法满足个人和企业的需求。据统计&#xff0c;全球每年有超过2亿人面临职业转型困境&#xff0c;而企业也因此遭…...

编程新知 2025/7/25 0:58:11