CSS阴影优化气泡框样式

<body>
<div class="pop">气泡框</div>
</body>
body{display: flex;justify-content: center;align-items: center;height: 100%
}
.pop{display: flex;justify-content: center;align-items: center;background: #409eff;width: 150px;height: 70px;position: relative;border-radius: 5px;color: #fff;/** box-shadow: 0 0 10px #000;   换成filter*/filter: drop-shadow(0 0 10px #000) /** filter表示滤镜  drop-shadow表示阴影滤镜 */
}
.pop::before{content: '';background: #409eff;position: absolute;width: 20px;height: 20px;transform: rotate(45deg);left: -10px;top: 50%;margin-top: -10px;
}

在这里插入图片描述

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

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

相关文章

03-Shell编程之循环语句与函数

目录 3.1 for循环语句 3.1.1for语句的结构 3.1.2 for语句应用实例 3.2 使用whlie循环语句 1.打印数字1到5 3.3 使用until循环语句 3.3.1until的实例 1.打印数字1到5&#xff08;使用until的逆向逻辑&#xff09; 2.等待用户输入特定内容 3.4 函数 3.4.1Shell函数的基…

自学C语言-10

第10章 指针 指针是C语言的一个重要组成部分&#xff0c;是C语言的核心、精髓所在。用好指针&#xff0c;可以在C语言开发中起到事半功倍的效果。一方面&#xff0c;可以提高程序的编译效率、执行速度&#xff0c;以及动态存储分配&#xff1b;另一方面&#xff0c;可使程序更加…

playwright录制脚本原理

Paywright录制工具UI 在上一篇博客中介绍了如何从0构建一款具备录制UI测试的小工具。此篇博客将从源码层面上梳理playwright录制原理。当打开playwright vscode插件时&#xff0c;点击录制按钮&#xff0c;会开启一个新浏览器&#xff0c;如下图所示&#xff0c;在新开浏览器页…

Hive基础知识(十八):Hive 函数的使用

1. 系统内置函数 1&#xff09;查看系统自带的函数 hive (hive3)> show functions; Time taken: 0.085 seconds, Fetched: 289 row(s) 2&#xff09;显示自带的函数的用法 hive (hive3)> desc function upper; OK tab_name upper(str)- Returns str with all characters…

“了解MySQL中的enum枚举数据类型“

目录 # 开篇 1. 创建包含枚举类型的表 2. 插入枚举类型的数据 3. 查询包含枚举类型的表 4. 更新枚举类型的数据 5. 使用枚举类型的好处 注意事项 示例总结 附加 # 开篇 在数据库中&#xff0c;枚举&#xff08;ENUM&#xff09;是一种数据类型&#xff0c;用于存储一组…

即插即用篇 | 手把手教你 YOLOv10 添加注意力机制 | 20+ 种全打通!

YOLOv10 添加注意力机制 ! 视频教程地址-哔哩哔哩 文章目录 YOLOv10 添加注意力机制 !注意力机制介绍注意力机制的分类1. SE 注意力模块1.1 原理1.2 代码2. CBAM 注意力模块2.1 原理2.2 代码3. ECA 注意力模块3.1 原理3.2 代码4. CA 注意力模块4.1 原理4.2 代码5. 添加方式�…

构建开源多模态RAG系统

在这个新的冒险中&#xff0c;我们将深入研究使用开源大型语言多模态&#xff08;LLMM&#xff09;构建检索增强型生成&#xff08;RAG&#xff09;系统的过程。值得注意的是&#xff0c;我们的重点是在不依赖LangChain或Llama索引的情况下实现这一点&#xff1b;相反&#xff…

LabVIEW在机器人研究所中的应用

机器人研究所致力于机器人技术的研究与开发&#xff0c;涵盖工业机器人、服务机器人、医疗机器人等多个领域。研究所需要一个高效、灵活的实验控制和数据采集系统&#xff0c;以进行复杂的机器人实验&#xff0c;并对实验数据进行实时处理和分析。 项目需求 实时控制与监控&am…

NC--介绍-未加密加密后-流量抓包对比

免责声明:本节仅做技术交流与学习... 目录 介绍: 用法: 未加密--流量抓包 加密: 攻击端 靶机 抓包分析: 介绍: nc 是一个Linux环境下常用的工具命令&#xff0c;可以用来帮助开发者查询和解决网路问题&#xff0c;通常被认为是 NetCat 工具的缩写&#xff0c;在网络工具…

Hi3861 OpenHarmony嵌入式应用入门--轮询按键

本篇介绍使用轮询方式读取gpio状态来判断按键状态。 原理图如下 GPIO API API名称 说明 hi_u32 hi_gpio_init(hi_void); GPIO模块初始化 hi_u32 hi_io_set_pull(hi_io_name id, hi_io_pull val); 设置某个IO上下拉功能。 hi_u32 hi_gpio_set_dir(hi_gpio_idx id, hi_gpi…

MySQL理解-下载-安装

MySQL理解: mysql:是一种关系型数据库管理系统。 下载&#xff1a; 进入官网MySQLhttps://www.mysql.com/ 找到download 滑动到最下方&#xff1a;有一个开源社区版的链接地址&#xff1a; 然后就下载完成了 安装&#xff1a; 双击&#xff1a; 一直next 一直next这一步&…

仓颉编程语言入门

华为在 2024 年 6 月 21 日的华为开发者大会上&#xff0c;华为终端 BG 软件部总裁龚体正式官宣了华为自研仓颉编程语言&#xff0c;并发布了 HarmonyOS NEXT 仓颉语言开发者预览版。 仓颉编程语言文件后缀名为 .cj, 以下是第一个入门代码输出&#xff1a;你好&#xff0c;仓颉…

ESP32-S3方案应用设备无线交互技术,产品远程控制与语音交互

在物联网和人工智能(AI)技术融合的浪潮中&#xff0c;ESP32-S3芯片以其卓越的性能和多功能性&#xff0c;成为智能家居和工业自动化领域的明星产品。 ESP32-S3是一款基于Xtensa LX6处理器的嵌入式系统级芯片&#xff0c;具有高效、低功耗的特点。集成的Wi-Fi和蓝牙功能&#x…

三大交易所全面恢复 IPO 申请

6月21日晚间&#xff0c;北交所受理了3家企业的IPO申请&#xff0c;这是北交所时隔3个月之后恢复IPO受理。6月20日晚间&#xff0c;沪深交易所各受理了1家IPO申请&#xff0c;这是沪深交易所时隔半年后再次受理IPO。这也意味着&#xff0c;三大交易所IPO受理全部恢复。 6月21日…

致敬企业家精神:比亚迪仰望发布“旷野宣言”

近年来&#xff0c;随着汽车在中国的普及&#xff0c;钟爱越野和探险的车主群体也在飞速发展壮大。 那么问题就来了&#xff1a;为什么会有这么多的人们钟爱越野和探险&#xff1f;越野精神究竟是什么&#xff1f; 作为备受关注的硬派越野车&#xff0c;比亚迪旗下的高端品牌仰…

编程精粹—— Microsoft 编写优质无错 C 程序秘诀 08:剩下的就是态度问题

这是一本老书&#xff0c;作者 Steve Maguire 在微软工作期间写了这本书&#xff0c;英文版于 1993 年发布。2013 年推出了 20 周年纪念第二版。我们看到的标题是中译版名字&#xff0c;英文版的名字是《Writing Clean Code ─── Microsoft’s Techniques for Developing》&a…

C++基础编程100题-013 OpenJudge-1.3-11 计算浮点数相除的余数

更多资源请关注纽扣编程微信公众号 http://noi.openjudge.cn/ch0103/11/ 描述 计算两个双精度浮点数a和b的相除的余数&#xff0c;a和b都是正数的。这里余数&#xff08;r&#xff09;的定义是&#xff1a;a k * b r&#xff0c;其中 k是整数&#xff0c; 0 < r < b。…

Spring Boot 快速入门4 ——JSR-303 数据校验

目录 一、前言 二、JSR303 简介 三、使用方法 常用注解 Validated、Valid区别 四、编写测试代码&#xff1a; 1. 实体类添加校验 2. 统一返回类型 3. 测试类 4.我们把异常返回给页面 5.抽离全局异常处理 2. 书写ExceptionControllerAdvice 一、前言 我们在日常开发…

鸿蒙开发系统基础能力:【@ohos.hiTraceChain (分布式跟踪)】

分布式跟踪 本模块提供了端侧业务流程调用链跟踪的打点能力&#xff0c;包括业务流程跟踪的启动、结束、信息埋点等能力。 说明&#xff1a; 本模块首批接口从API version 8开始支持。后续版本的新增接口&#xff0c;采用上角标单独标记接口的起始版本。 导入模块 import hi…

小鹏MONA M03实车曝光

ChatGPT狂飙160天&#xff0c;世界已经不是之前的样子。 更多资源欢迎关注 小鹏汽车 MONA 系列首款车型已经官宣命名为“M03”&#xff0c;预计将于今年第三季度上市。 现在&#xff0c;这款新车的实车照片已经在网上流传开来。 此次曝光的是一款米色车漆版本&#xff0c;与当…