css: hover 划过显示/隐藏 div 样式

1. 图例: 划过用display: block;和 display: none; 显示div和隐藏div



div:

<div class="sectorBox">

        <div v-for="(item, index) in sectorList" :key="index" class="sill">

          <div class="si_show" :style="{ backgroundImage: 'url(' + item.img1 + ')' }">

            <span>

              <i>{ { item.name }}</i>

              <i>{ { item.conten }}</i>

            </span>

            <div class="i_ing">

              <i span @click="siKnow(item.name)">查看详情 </i>

            </div>

          </div>

          <div class="si_item" :style="{ backgroundImage: 'url(' + item.img + ')' }">

            <img src="item.img1" alt="" />

            <span>{ { item.name }}</span>

            <span>{ { item.conten }}</span>

          </div>

        </div>

      </div>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

三维点云处理-聚类(下)

接着前一部分数据聚类方法的介绍&#xff0c;由于K-means和GMM方法都是基于欧式距离信息处理的&#xff0c;两者分别以圆形和椭圆形来作为数据的聚类分割方式&#xff0c;这种情况下会导致环形图和月牙图数据分割不准确&#xff0c;因此进一步的介绍一种谱聚类方法&#xff0c;…

Elastic 通过 AI 驱动的安全分析改变 SIEM 游戏

作者&#xff1a;Santosh Krishnan, Jennifer Ellard 借助由搜索 AI 提供支持的新攻击发现功能&#xff0c;优先考虑攻击&#xff0c;而不是警报。 传统的安全信息与事件管理系统&#xff08;SIEM&#xff09;在很大程度上依赖屏幕背后的人类才能取得成功。警报、仪表盘、威胁…

Python高级编程-DJango2

Python高级编程-DJango2 没有清醒的头脑&#xff0c;再快的脚步也会走歪&#xff1b;没有谨慎的步伐&#xff0c;再平的道路也会跌倒。 目录 Python高级编程-DJango2 1.显示基本网页 2.输入框的形式&#xff1a; 1&#xff09;文本输入框 2&#xff09;单选框 3&#xff…

我用 GitHub 9.8k 的 Go 语言 2D 游戏引擎写了个游戏

前言 hi&#xff0c;大家好&#xff0c;这里是白泽。今天给大家分享一个 GitHub &#x1f31f;9.8k 的 Go 语言 2D 游戏引擎。 https://github.com/hajimehoshi/ebiten 引擎的贡献者依旧在积极维护&#xff0c;是一个兼具学习 & 娱乐的项目&#xff01; 为此我也用这个…

数据结构-线性表-应用题-2.2-11

1)算法的基本设计思想&#xff1a; 分别求两个升序序列的中位数a,b 若ab&#xff0c;则a或b即为所求中位数 若a<b&#xff0c;则舍弃A中较小的一半&#xff08;中位数偏小&#xff0c;往后面找&#xff09;&#xff0c;同时舍弃序列B中较大的一半&#xff0c;两次舍弃长度…

meshlab: pymeshlab保存物体的横截面(compute planar section)

一、关于环境 请参考&#xff1a;pymeshlab遍历文件夹中模型、缩放并导出指定格式-CSDN博客 二、关于代码 本文所给出代码仅为参考&#xff0c;禁止转载和引用&#xff0c;仅供个人学习。 # pymeshlab需要导入&#xff0c;其一般被命名为ml import pymeshlab as ml# 本案例所…

C++ | Leetcode C++题解之第74题搜索二维矩阵

题目&#xff1a; 题解&#xff1a; class Solution { public:bool searchMatrix(vector<vector<int>>& matrix, int target) {int m matrix.size(), n matrix[0].size();int low 0, high m * n - 1;while (low < high) {int mid (high - low) / 2 l…

YOLOv8的训练、验证、预测及导出[目标检测实践篇]

这一部分内容主要介绍如何使用YOLOv8训练自己的数据集&#xff0c;并进行验证、预测及导出&#xff0c;采用代码和指令的两种方式&#xff0c;参考自官方文档&#xff1a;Detect - Ultralytics YOLOv8 Docs。实践篇不需要关注原理&#xff0c;只需要把流程跑通就行&#xff0c;…

白色或类白色的粉末/固体,DOTA-Ala-Ala-Tyr-COOH,是一种具有特定氨基酸序列的多肽,具有良好的稳定性和溶解性

一、试剂信息 英文名&#xff1a;DOTA-Ala-Ala-Tyr-COOH&#xff0c;DOTA-AAY-OHCAS号&#xff1a;N/A分子式&#xff1a;C31H47N7O12分子量&#xff1a;709.74结构式&#xff1a; 纯度标准&#xff1a;≥95%包装规格&#xff1a;1g&#xff0c;5g&#xff0c;10g&#xff08…

Selenium——获取元素和操纵元素的方法

1、获取元素的方法 1、通过id获取 element wd.find_element(By.ID,"id")2、通过classname获取 elements wd.find_elements_by_class_name("plant") for element in elements:print(element.text)3、通过tagname获取元素 elements wd.find_elements_…

SpringBoot2 仿B站高性能前端+后端项目(wanjie)

SpringBoot2 仿B站高性能前端后端项目(完结) Spring Boot 2 仿B站高性能前端后端项目&#xff1a;打造高效、稳定、可扩展的应用 在当今的互联网时期&#xff0c;网站的性能、稳定性和可扩展性成为了权衡一个项目胜利与否的关键要素。本文将引见如何运用 Spring Boot 2 构建一…

AIGC-3D数字人技术:高效助推各行业数字化水平升级

从“互联网”到“人工智能”&#xff0c;数字员工作为一种全新的交互形式&#xff0c;对企业有着重要的作用&#xff0c;企业、品牌通过数字人的AI语音交互、AI播报等核心功能&#xff0c;可以有效推动企业提升数字水平。 作为3D、AI虚拟数字人技术服务商及方案提供商&#xff…

鸿蒙内核源码分析(工作模式篇) | CPU的七种工作模式

本篇说清楚CPU的工作模式 工作模式(Working mode) 也叫操作模式&#xff08;Operating mode&#xff09;又叫处理器模式&#xff08;Processor mode&#xff09;&#xff0c;是 CPU 运行的重要参数&#xff0c;决定着处理器的工作方式&#xff0c;比如如何裁决特权级别和报告异…

【IP:Internet Protocol,子网(Subnets),IPv6:动机,层次编址:路由聚集(rout aggregation)】

文章目录 IP&#xff1a;Internet Protocol互联网的的网络层IP分片和重组&#xff08;Fragmentation & Reassembly&#xff09;IP编址&#xff1a;引论子网&#xff08;Subnets&#xff09;特殊IP地址IP 编址: CIDR子网掩码&#xff08;Subnet mask&#xff09;转发表和转发…

【verilog-语法】编译命令( compiler directives )

一、前言 编译器指令的范围是从它的出现的点延伸到处理的所有文件&#xff0c;直到另一个编译器指令取代它或处理结束。编所有的编译命令都有重音符 " "引出。在IEEE std1364-2005中共介绍了19条编译命令&#xff0c;这19条命令又可分为12组命令进行独立或组合使用…

Unity射击游戏开发教程:(12)使用后处理

后处理 后期处理是向您的游戏场景添加一个或多个滤镜,确实可以为您的游戏提供精美的外观。在本文中,我们将讨论如何在 Unity 中设置后处理系统,从那里您可以探索和试验 Unity 提供的所有过滤器。 首先,我们需要从包管理器添加后处理器堆栈。包管理器是 Unity 产品的集合,…

【LAMMPS学习】八、基础知识(5.11)磁自旋

8. 基础知识 此部分描述了如何使用 LAMMPS 为用户和开发人员执行各种任务。术语表页面还列出了 MD 术语&#xff0c;以及相应 LAMMPS 手册页的链接。 LAMMPS 源代码分发的 examples 目录中包含的示例输入脚本以及示例脚本页面上突出显示的示例输入脚本还展示了如何设置和运行各…

1:测试驱动

前领科技DAY1 1&#xff1a;测试驱动的步骤&#xff1a;下载芯片厂商的sdk&#xff0c;下载jlinke&#xff0c;在jlinke打印信息.jlinke的控制地址在D:\ruanjian\GR_RING\projects\ring\Keil_5\Listings这个目录下 但是jlinke一般都是可以自动检测的 2&#xff1a;目录结构对应…

深入剖析Tomcat(七) 日志记录器

在看原书第六章之前&#xff0c;一直觉得Tomcat记日志的架构可能是个“有点东西”的东西。在看了第六章之后呢&#xff0c;额… 就这&#xff1f;不甘心的我又翻了翻logback与新版tomcat的源码&#xff0c;额…&#xff0c;日志架构原来也没那么神秘。本篇文章先过一遍原书内容…

计算机视觉——OpenCV Otsu阈值法原理及实现

算法简介 Otsu阈值法&#xff0c;也被称为大津算法&#xff0c;是一种在图像处理中广泛使用的自动阈值分割技术。这种方法由日本学者大津展之于1979年提出&#xff0c;旨在根据图像的灰度直方图来自动选择最佳全局阈值。Otsu阈值法的核心思想是最小化类内方差或最大化类间方差…
最新文章