前端知识笔记(二十)———简易弹窗制作

这是自己闲来无事写的一个小弹窗,只需一个div标签,里面写入弹窗想要显示的内容即可,简单易懂,一看就会

HTML部分只需要写个div标签命个名,把弹窗内容写上就可以了

使用css添加样式

弹窗名{/* 弹窗位置自行调整 */position: fixed;top: 20vh;left: 90vh;/* 颜色自行调整 */background-color: #056774;/* 弹窗宽高自行调整 */width: 14vw;height: 8vh;/* 弹窗内容居中显示 */display: flex;align-items: center;justify-content: center;/* 弹窗内容样式自行调整 */color: #ffffff;font-weight: 800;/* 弹窗样式美化 */border-radius: 1vh;border: 0.2vh #ffffff solid;box-shadow: 1vh 1vh 10vh #011B29 inset;/* 弹窗显示方式 */opacity: 0;transition: 0.3s;
}

成品显示(自我感觉良好):

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

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

相关文章

数据结构 - 堆:TOP-K问题

问题描述 TOP-K问题:即求数据结合中前K个最大的元素或者最小的元素,一般情况下数据量都比较大 比如:专业前10名、世界500强、富豪榜、游戏中前100的活跃玩家等 对于Top-K问题,能想到的最简单直接的方式就是排序,但是&…

【网络安全技术】消息认证技术

一、哈希函数 1.安全性质 1)抗第一原像攻击(Preimage Resistance) 给定哈希后的值,很难找到哈希前的原消息。这很好理解,需要哈希函数具有单向性。 一个简单的例子就是密码存储系统,用户登录服务器需要…

0Ω电阻最大过流能力及作用用途

0Ω电阻最大过流能力及作用用途 0Ω电阻过流能力0Ω电阻的作用 0Ω电阻过流能力 0Ω电阻不一定是真正的0Ω电阻,0Ω电阻存在一定的阻值偏差,主要看生产电阻厂商做哪种了。厂商都是根据电阻标准文件 EN60115-2, 里头0Ω电阻实际最大阻值有 10…

在mysql的cmd下查看某个命令的帮助信息

在cmd下登录mysql以后,如果要查询某个命令的帮助信息,可以使用help 具体命令来查看该命令的帮助信息。 例如,假设我要查询create table这条命令怎么使用,可以输入 help create table,或者help create table&#xff1…

【数据结构(五)】递归

文章目录 1. 递归的概念2. 递归能解决什么问题3. 递归的规则4. 递归实际应用案例4.1. 迷宫问题4.2. 八皇后问题4.2.1. 思路分析4.2.1. 代码实现 1. 递归的概念 简单的说: 递归就是方法自己调用自己,每次调用时传入不同的变量。递归有助于编程者解决复杂的问题&…

Android 缩减、混淆处理和优化应用

为了尽可能减小应用的大小,您应在发布 build 中启用缩减功能来移除不使用的代码和资源。启用缩减功能后,您还会受益于两项功能,一项是混淆处理功能,该功能会缩短应用的类和成员的名称;另一项是优化功能,该功…

网站实现验证码功能

一、验证码 一般来说&#xff0c;网站在登录的时候会生成一个验证码来验证是否是人类还是爬虫&#xff0c;还有一个好处是防止恶意人士对密码进行爆破。 二、流程图 三、详细说明 3.1 后端生成验证码 Override public Result<Map<String, String>> getVerifica…

LeetCode | 100. 相同的树

LeetCode | 100. 相同的树 OJ链接 判断两个节点是否等于空&#xff0c;两个都等于空就直接返回true如果一个等于空&#xff0c;另一个不等于空&#xff0c;说明false然后再判断两个树的值是否相等最后递归p的左&#xff0c;q的左&#xff0c;p的右&#xff0c;q的右 bool isS…

计算机网络TCP篇①

目录 一、TCP 基本信息 1.1、TCP 的头格式 1.2、什么是 TCP 1.3、什么是 TCP 连接 1.4、TCP 与 UDP 的区别 1.2、TCP 连接建立 1.2.1、TCP 三次握手的过程 1.2.2、为什么是三次握手&#xff1f;不是两次&#xff1f;四次&#xff1f;&#xff08;这个问题真是典中典&am…

山西电力市场日前价格预测【2023-12-03】

日前价格预测 预测说明&#xff1a; 如上图所示&#xff0c;预测明日&#xff08;2023-12-03&#xff09;山西电力市场全天平均日前电价为360.65元/MWh。其中&#xff0c;最高日前电价为517.29元/MWh&#xff0c;预计出现在00:30。最低日前电价为0.00元/MWh&#xff0c;预计出…

nodejs微信小程序+python+PHP金融产品销售系统的设计与实现-计算机毕业设计推荐

目 录 摘 要 I ABSTRACT II 目 录 II 第1章 绪论 1 1.1背景及意义 1 1.2 国内外研究概况 1 1.3 研究的内容 1 第2章 相关技术 3 2.1 nodejs简介 4 2.2 express框架介绍 6 2.4 MySQL数据库 4 第3章 系统分析 5 3.1 需求分析 5 3.2 系统可行性分析 5 3.2.1技术可行性&#xff1a;…

网络通信原理,进制转化总结

来源&#xff0c;做个笔记&#xff0c;讲的还蛮清楚通信原理-2.5 数据封装与传输05_哔哩哔哩_bilibili ip地址范围