vue 控件的四个角设置 父视图position:relative
父视图relative,子视图 absolute
<div class="bg1">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="tableTitle">
<div style="float: left;;">7日内出库排行</div>
</div>
<div id="main11" style="width: 100% !important;height:calc(100vh * 340 / 1080) ;"
class="echart">
</div>
</div>
.topL {
width: 5px;
height: 5px;
border-top-width: 2px;
border-top-color: #26c6f0;
border-top-style: solid;
border-left-width: 2px;
border-left-color: #26c6f0;
border-left-style: solid;
position: absolute;//根据父视图决定位置
top: -2px;
left: -2px;
}
.topR {
width: 5px;
height: 5px;
border-top-width: 2px;
border-top-color: #26c6f0;
border-top-style: solid;
border-right-width: 2px;
border-right-color: #26c6f0;
border-right-style: solid;
position: absolute;
top: -2px;
right: -2px;
}
.bottomL {
width: 5px;
height: 5px;
border-bottom-width: 2px;
border-bottom-color: #26c6f0;
border-bottom-style: solid;
border-left-width: 2px;
border-left-color: #26c6f0;
border-left-style: solid;
position: absolute;
bottom: -2px;
left: -2px;
}
.bottomR {
width: 5px;
height: 5px;
border-bottom-width: 2px;
border-bottom-color: #26c6f0;
border-bottom-style: solid;
border-right-width: 2px;
border-right-color: #26c6f0;
border-right-style: solid;
position: absolute;
bottom: -2px;
right: -2px;
}
.bg1 {
height: calc(100vh *385 / 1080);
width: 100%;
border-radius: 5px;
border: 1px solid rgba(25, 186, 139, .17);
background: rgba(255, 255, 255, .04);
position: relative;//相对于自身的位置而言
}
相关文章:
vue 控件的四个角设置 父视图position:relative
父视图relative,子视图 absolute <div class"bg1"> <i class"topL"></i> <i class"topR"></i> <i class"bottomL"></i> <i class"bottomR"></i> <di…...
VM中linux虚拟机配置桥接模式(虚拟机与宿主机网络互通)
VM虚拟机配置桥接模式,可以让虚拟机和物理主机一样存在于局域网中,可以和主机相通,和互联网相通,和局域网中其它主机相通。 vmware为我们提供了三种网络工作模式,它们分别是:Bridged(桥接模式&…...
7.Eclipse中改变编码方式及解决部分乱码问题
1、改变整个工作空间的编码方式: 点击Window->Preference->General->workplace,然后选择默认编码方式 2、改变某个项目的编码方式: 右键点击项目名->Properties>Resource,然后选择默认编码方式。 问题ÿ…...
grafana 的 ws websocket 连接不上的解决方式
使用了多层的代理方式,一层没有此问题 错误 WebSocket connection to ‘wss://ip地址/grafana01/api/live/ws’ failed: 日志报错 msg“Request Completed” methodGET path/api/live/ws status403 解决方式 # allowed_origins is a comma-separated list of o…...
多环境_部署项目
多环境: 指同一套项目代码在不同的阶段需要根据实际情况来调整配置并且部署到不同的机器上。 为什么需要? 1. 每个环境互不影响 2. 区分不同的阶段:开发 / 测试 / 生产 3. 对项目进行优化: 1. 本地日志级别 2. 精简依赖&a…...
go web框架 gin-gonic源码解读02————router
go web框架 gin-gonic源码解读02————router 本来想先写context,但是发现context能简单讲讲的东西不多,就准备直接和router合在一起讲好了 router是web服务的路由,是指讲来自客户端的http请求与服务器端的处理逻辑或者资源相映射的机制。&…...
【Java后端封装数据】常见后端封装数据的格式,用于返回给前端使用(109)
数据格式一:包装 List Map 返回,常用于数据展示; // Controller:public Result selectRegConfig(RequestBody String param) {try {Map<String, Object> paramMap JsonUtils.readValue(param, Map.class);return Result.su…...
无脑入门pytorch系列(三)—— nn.Linear
本系列教程适用于没有任何pytorch的同学(简单的python语法还是要的),从代码的表层出发挖掘代码的深层含义,理解具体的意思和内涵。pytorch的很多函数看着非常简单,但是其中包含了很多内容,不了解其中的意思…...
SQL Server用sql语句添加列,添加列注释
SQL Server用sql语句添加列,添加列注释 微软文档: https://learn.microsoft.com/zh-cn/sql/relational-databases/tables/add-columns-to-a-table-database-engine?viewsql-server-ver15 alter table article add RedirectURL varchar(600) nu…...
springBoot中service层查询使用多线程CompletableFuture(有返回值)
重点: 1. 创建线程池 Executor executor Executors.newCachedThreadPool();//保存线程List<CompletableFuture<Void>> futures new ArrayList<>();2.使用 //这里可以是多个看下面代码是在for中使用的 CompletableFuture<Void> future …...
畜牧虚拟仿真 | 鱼授精过程VR模拟演练系统
随着科技的发展,虚拟现实(VR)技术逐渐渗透到各个领域,为人们提供了更加真实、直观的体验。在动物养殖教育领域,鱼授精过程VR模拟演练系统正成为一种新的教学手段,它能够帮助人们更好地理解和掌握鱼授精的操作技巧,从而…...
第一百一十四回 局部动态列表
文章目录 概念介绍实现方法示例代码 我们在上一章回中介绍了dart语言中的 setter/getter相关的内容,本章回中将介绍 局部动态列表.闲话休提,让我们一起Talk Flutter吧。 概念介绍 在正常情况下列表位于整个页面中,而且可以在整个页面中滚动…...
多尺度目标检测【动手学深度学习】
在上篇博客《锚框【目标检测】》中,我们以输入图像的每个像素为中心,生成多个锚框。基本而言,这些锚框代表了图像不同区域的样本。然而如果以每个像素都生成的锚框,最后可能会得到太多需要计算的锚框。想象一个561728的输入图像,如果以每个像素为中心生成五个形状不同的锚…...
elasticsearch 基础
ES 搜索技术历史 今天看的是《Elasticsearch实战与原理解析》 第一章 搜索技术发展史 1、搜索技术发展史 宏观而言,搜索引擎的发展经历了五个尖端和两大分类。五个阶段分别是ftp文件检索阶段、分类目录阶段、文本相关性检索阶段、网页链接分析阶段和用户意图识别…...
【BUG】docker安装nacos,浏览器却无法访问到页面
个人主页:金鳞踏雨 个人简介:大家好,我是金鳞,一个初出茅庐的Java小白 目前状况:22届普通本科毕业生,几经波折了,现在任职于一家国内大型知名日化公司,从事Java开发工作 我的博客&am…...
C#引用Web Service 类型方法,添加搜索本地服务器Web Service 接口调用方法
首先保证现在网络能调用web service接口,右键项目添加服务引用  点击高级 添加web服务 输入搜索的服务器接口,选中你要添加调用的方法即可 添加完成调用方…...
yolov8训练进阶:新增配置参数
续yolov8训练进阶:自定义训练脚本,从配置文件载入训练超参数_CodingInCV的博客-CSDN博客 尽管yolov8有很多参数可以设置,但难免我们训练过程中会需要增加自己的参数,如新的数据增强、自定义的一些条件。那么在yolov8中如何实现呢&…...
轻量级自动化测试框架WebZ
一、什么是WebZ WebZ是我用Python写的“关键字驱动”的自动化测试框架,基于WebDriver。 设计该框架的初衷是:用自动化测试让测试人员从一些简单却重复的测试中解放出来。之所以用“关键字驱动”模式是因为我觉得这样能让测试人员(测试执行人员…...
如何实现安全上网
l 场景描述 政府、军工、科研等涉密单位或企业往往要比其他组织更早接触高精尖的技术与产品,相对应的数据保密性要求更高。常规的内外网物理隔离手段,已经满足不了这些涉密单位的保密需求,发展到现在,需求已经演变成既要保证网络…...
Redis心跳检测
在命令传播阶段,从服务器默认会以每秒一次的频率,向主服务器发送命令: REPLCON FACK <rep1 ication_ offset>其中replication_offset是从服务器当前的复制偏移量。 发送REPLCONF ACK命令对于主从服务器有三个作用: 检测主…...
SpringBoot-17-MyBatis动态SQL标签之常用标签
文章目录 1 代码1.1 实体User.java1.2 接口UserMapper.java1.3 映射UserMapper.xml1.3.1 标签if1.3.2 标签if和where1.3.3 标签choose和when和otherwise1.4 UserController.java2 常用动态SQL标签2.1 标签set2.1.1 UserMapper.java2.1.2 UserMapper.xml2.1.3 UserController.ja…...
Flask RESTful 示例
目录 1. 环境准备2. 安装依赖3. 修改main.py4. 运行应用5. API使用示例获取所有任务获取单个任务创建新任务更新任务删除任务 中文乱码问题: 下面创建一个简单的Flask RESTful API示例。首先,我们需要创建环境,安装必要的依赖,然后…...
AI Agent与Agentic AI:原理、应用、挑战与未来展望
文章目录 一、引言二、AI Agent与Agentic AI的兴起2.1 技术契机与生态成熟2.2 Agent的定义与特征2.3 Agent的发展历程 三、AI Agent的核心技术栈解密3.1 感知模块代码示例:使用Python和OpenCV进行图像识别 3.2 认知与决策模块代码示例:使用OpenAI GPT-3进…...
day52 ResNet18 CBAM
在深度学习的旅程中,我们不断探索如何提升模型的性能。今天,我将分享我在 ResNet18 模型中插入 CBAM(Convolutional Block Attention Module)模块,并采用分阶段微调策略的实践过程。通过这个过程,我不仅提升…...
边缘计算医疗风险自查APP开发方案
核心目标:在便携设备(智能手表/家用检测仪)部署轻量化疾病预测模型,实现低延迟、隐私安全的实时健康风险评估。 一、技术架构设计 #mermaid-svg-iuNaeeLK2YoFKfao {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg…...
IT供电系统绝缘监测及故障定位解决方案
随着新能源的快速发展,光伏电站、储能系统及充电设备已广泛应用于现代能源网络。在光伏领域,IT供电系统凭借其持续供电性好、安全性高等优势成为光伏首选,但在长期运行中,例如老化、潮湿、隐裂、机械损伤等问题会影响光伏板绝缘层…...
什么?连接服务器也能可视化显示界面?:基于X11 Forwarding + CentOS + MobaXterm实战指南
文章目录 什么是X11?环境准备实战步骤1️⃣ 服务器端配置(CentOS)2️⃣ 客户端配置(MobaXterm)3️⃣ 验证X11 Forwarding4️⃣ 运行自定义GUI程序(Python示例)5️⃣ 成功效果来创建子进程,创建出来的进程就是子进程,原来的进程为父进程。…...
【生成模型】视频生成论文调研
工作清单 上游应用方向:控制、速度、时长、高动态、多主体驱动 类型工作基础模型WAN / WAN-VACE / HunyuanVideo控制条件轨迹控制ATI~镜头控制ReCamMaster~多主体驱动Phantom~音频驱动Let Them Talk: Audio-Driven Multi-Person Conversational Video Generation速…...
