CSS实现一些小功能
1.信封边框的实现
1.1 使用背景渐变
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">.uu {width: 200px;height: 70px;padding:1em;border: 1em solid transparent;background: linear-gradient(white,white) padding-box,repeating-linear-gradient(-45deg, red 0, red 12.5%, transparent 0, transparent 25%, #58a 0, #58a 37.5%, transparent 0, transparent 50%) 0/5em 5em; }</style></head><body><div class="uu"></div></body>
</html>
1.2 使用边框图片
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">.uu {width: 200px;height: 70px;padding: 1em;border: 1em solid transparent;background:linear-gradient(white,white) padding-box,repeating-linear-gradient(-45deg, red 0, red 12.5%, transparent 0, transparent 25%, #58a 0, #58a 37.5%, transparent 0, transparent 50%) 0/5em 5em;}</style></head><body><div class="uu"></div></body>
</html>
2.内凹圆角(优惠券)
2.1 使用伪类
<div class="main"></div>
<style>
.main {position: relative;width: 200px;height: 40px;margin: 0 5px;background: -webkit-linear-gradient(left, #F6327C, #DF3DF0);background: linear-gradient(to right, #F6327C, #DF3DF0);
}
.main::before {position: absolute;content: "";display: block;position: absolute;top: 0;left: -5px;width: 5px;height: 40px;border-radius: 2px 0 0 2px;background:-webkit-radial-gradient(10px at left,transparent 50%,#F6327C 50%);background: radial-gradient(10px at left,transparent 50%,#F6327C 50%);
}
.main::after {position: absolute;content: "";display: block;position: absolute;top: 0;right: -5px;width: 5px;height: 40px;border-radius: 0 2px 2px 0;background: -webkit-radial-gradient(10px at right,transparent 50%,#F6327C 50%);background: radial-gradient(10px at right,transparent 50%,#F6327C 50%);
}
</style>
相关文章：
CSS实现一些小功能
1.信封边框的实现 1.1 使用背景渐变 <!DOCTYPE html><html><head><meta charset"UTF-8"><title></title><style type"text/css">.uu {width: 200px;height: 70px;padding:1em;border: 1em solid transparent;…...
Ubuntu安装nfs服务步骤
Ubuntu安装nfs服务步骤 一、NFS？ NFS：网络文件系统（Network File system File）缩写，可通过网络让不同的机器，不同操作系统之间可以彼此共享文件和目录。 二、安装 1.安装nfs服务器命令：sudo…...
android开发：子线程更新UI界面
多线程操作经常希望在子线程更新界面，这样方便调试，但是，但是经常这样做程序就不对劲了，为什么呢？因为为了保证界面流畅，不允许在非UI线程直接操作界面，只能通过一些专门途径进行。另外…...
P9242 [蓝桥杯 2023 省 B] 接龙数列(dp+最长接龙序列+分类)
1. 计算0~9为结尾的最长子串长度 2. 对于每个数字，比较其开头可连接子串长度1 与 原来以其末位为末尾的子串长度 3. 更新以其末位为末尾的子串长度 #include<iostream> #include<string.h>using namespace std;// 相当于记录…...
网络运维与网络安全 学习笔记2023.11.29
网络运维与网络安全 学习笔记 第三十天 今日更新太晚啦！！！ 主要是今天工作时挨了一天骂，服了，下次记得骂的轻一点！！！ （要不是为了那点微薄的薪资，谁愿意听你…...
Java实现通过经纬度求两个任意地点在球面上的距离
我们在实际开发中会获取对应的经纬度，可以使用ES大数据搜索引擎进行计算对应区域的数据，那我们在如何根据两个经纬度获取对应的球面距离，就是在地球上从一个地点到另一个地点的直线距离 工具类如下: public class GeoUtils {// 地球半径&am…...
vscode使用插件KoroFileHeader添加注释
一、简介 KoroFileHeader 是一款用于在 VSCode 中用于生成文件头部注释和函数注释的插件，支持所有主流语言，功能强大，灵活方便，文档齐全。 VSCode 安装 KoroFileHeader 好插件，就可以直接使用。 "fileheader.cu…...
NSAttributedString设置折行方式NSLineBreakByTruncatingTail，计算高度出错，高度返回异常。
iOS13上，NSAttributedString设置折行方式NSLineBreakByTruncatingTail，计算高度出错，只返回一行的高度。 NSMutableParagraphStyle *style [[NSMutableParagraphStyle alloc]init]; style.hyphenationFactor 1; // 设置每行的最后单词是…...
YOLOv8改进 | 2023 | DWRSeg扩张式残差助力小目标检测 （附修改后的C2f+Bottleneck）
论文地址：官方论文地址 代码地址：该代码目前还未开源，我根据论文内容进行了复现内容在文章末尾。 一、本文介绍 本文内容给大家带来的DWRSeg中的DWR模块来改进YOLOv8中的C2f和Bottleneck模块，主要针对的是小目标检测，…...
ssm+vue的物资物流系统的设计与实现（有报告）。Javaee项目，ssm vue前后端分离项目。
演示视频： ssmvue的物资物流系统的设计与实现（有报告）。Javaee项目，ssm vue前后端分离项目。 项目介绍： 采用M（model）V（view）C（controller）三层体…...
纵行科技获评“汽车物流行业优秀技术装备供应商”
近日，由中国物流与采购联合会主办，中物联汽车物流分会承办的“2023年全国汽车物流行业年会”在湖北十堰盛大召开。本次年会集合了汽车整车、零部件、售后备件、进出口物流企业和物流装备技术企业、科研机构及院校等，分享汽车物流行业现状、相…...
Chrome和chromedriver版本不匹配导致的UI自动化测试无法运行的问题
今天，遇到一个小问题，本来跑的好好UI自动化测试脚本突然不好使了，期初怀疑是页面元素有调整导致脚本出现异常无法正常执行，经排查后发现近期页面没有任何调整。 这下头大了，啥也没改，怎么好好的脚本不能跑…...
[go 面试] 深入理解进程、线程和协程的概念及区别
关注公众号【爱发白日梦的后端】分享技术干货、读书笔记、开源项目、实战经验、高效开发工具等，您的关注将是我的更新动力！ 在操作系统中，我们经常听到进程、线程和协程这些概念，它们都是用来描述执行单元的。接下来，我…...
人工智能即将彻底改变你使用计算机的方式
文章目录 每个人的私人助理“Clippy 是一个机器人，而不是特工。”卫生保健“一半需要心理健康护理的美国退伍军人没有得到治疗。”教育生产率娱乐和购物科技行业的冲击波技术挑战隐私和其他重大问题 今天我仍然像保罗艾伦和我创办微软时一样热爱软件。但是ÿ…...
工艺系统所管理数字化实践
摘要 本文介绍了上海核工程设计研究院在数字化转型方面的实践，包括业务数字化和管理数字化两个方面。业务数字化方面，该院通过开发小工具改进工作流程。管理数字化方面，该院采用零代码平台集中管理管道力学信息相关模型和数据，并…...
VsCode学习
一、在VsCode 上编写第一个C语言 在VsCode上写代码都是先打开文件夹，这样也方便管理代码和编译器产生的可执行程序，VsCode生成的配置文件等。 1.1打开文件夹 写代码前，首先创立一个文件夹存储以后我们写的VsCode代码，便于管理。…...
Javaweb之Vue组件库Element案例的详细解析
4.4 案例 4.4.1 案例需求 参考 资料/页面原型/tlias智能学习辅助系统/首页.html 文件，浏览器打开，点击页面中的左侧栏的员工管理，如下所示： 需求说明： 制作类似格式的页面 即上面是标题，左侧栏是导航&…...
Bert-VITS2本地部署遇到的错误
关于Bert-VITS2本地部署遇到的错误 1、在下载python中相关依赖时报错 building ‘hdbscan._hdbscan_tree’ extension error: Microsoft Visual C 14.0 or greater is required. Get it with “Microsoft C Build Tools”: https://visualstudio.microsoft.com/visual-cpp-bu…...
【Ambari】HDFS基于Ambari的常规运维
🦄 个人主页——🎐开着拖拉机回家_大数据运维-CSDN博客 🎐✨🍁 🪁🍁🪁🍁🪁🍁🪁🍁 🪁🍁🪁…...
WIFI模块（esp-01s）获取网络时间与天气信息
目录 一、硬件连接 二、获取网络时间 1、AT指令集 2、具体操作 三、获取天气信息 1、心知天气注册 2、AT指令集 3、具体操作 4、json格式检查 一、硬件连接 WiFi模块的RX连接TTL模块的TX， WiFi模块的TX连接TTL模块的RX，电源与地接对。 插入电脑…...
别再用临时邮箱了！用Python+Selenium自动化管理你的Augment AI多账户（附完整脚本）
构建可持续的Augment AI自动化账户管理系统 在AI辅助编程工具日益普及的今天，开发者们对高效工具的依赖程度越来越高。Augment AI作为一款强大的代码助手，其免费版本300次的使用限制常常成为开发者工作流中的瓶颈。传统解决方案如手动重置或使用临时邮箱…...
Arduino非阻塞编程：Pin与WaitDo轻量级嵌入式工具库
1. 项目概述HDW-Utils 是一个面向 Arduino 平台的轻量级嵌入式工具库，其核心设计目标并非提供底层硬件驱动，而是解决嵌入式开发中高频出现的代码重复性、结构松散性与阻塞式延时滥用三大工程痛点。该库以“硬件开发者的实用主义”为出发点，通…...
基于springboot+vue房屋拆迁管理系统hx0514Z1A1
文章目录详细视频演示技术介绍功能介绍核心代码系统效果图源码获取详细视频演示 文章底部名片，获取项目的完整演示视频，免费解答技术疑问 技术介绍 开发语言：Java 框架：ssm JDK版本：JDK1.8 服务器：tomca…...
mPLUG-Owl3-2B工具评测：消费级GPU上的高效视觉问答解决方案
mPLUG-Owl3-2B工具评测：消费级GPU上的高效视觉问答解决方案 1. 引言：多模态AI的平民化时代 在AI技术快速发展的今天，能够同时理解图像和文本的多模态模型正变得越来越重要。想象一下，当你上传一张照片，AI不仅能识别其…...
华为防火墙IPsec点对点配置实战：从零到通的完整流程（附常见错误排查）
华为防火墙IPsec点对点配置实战：从零到通的完整流程（附常见错误排查） 在当今企业网络架构中，跨地域分支机构之间的安全通信已成为刚需。IPsec VPN凭借其强大的加密能力和标准化协议支持，成为构建安全通道的首选方案。华…...
[游戏辅助工具] HunterPie：怪物猎人世界数据可视化解决方案 - 面向狩猎效率追求者
[游戏辅助工具] HunterPie：怪物猎人世界数据可视化解决方案 - 面向狩猎效率追求者 【免费下载链接】HunterPie-legacy A complete, modern and clean overlay with Discord Rich Presence integration for Monster Hunter: World. 项目地址: https://gitcode.com/…...
trackerjacker硬件推荐：选择最佳无线网卡提升监控效果
trackerjacker硬件推荐：选择最佳无线网卡提升监控效果 【免费下载链接】trackerjacker Like nmap for mapping wifi networks youre not connected to, plus device tracking 项目地址: https://gitcode.com/gh_mirrors/tr/trackerjacker trackerjacker是一款…...
ViGEmBus：终极Windows虚拟手柄驱动完整使用教程
ViGEmBus：终极Windows虚拟手柄驱动完整使用教程 【免费下载链接】ViGEmBus Windows kernel-mode driver emulating well-known USB game controllers. 项目地址: https://gitcode.com/gh_mirrors/vi/ViGEmBus ViGEmBus是一款革命性的Windows内核级虚拟手柄驱…...
别再只会‘永不在此停止’了！实战绕过网站JS混淆与内存爆破的三种硬核方法
实战突破：三种硬核方法破解JS混淆与内存爆破 打开开发者工具的那一刻，页面突然卡死，控制台不断弹出debugger断点——这可能是每个爬虫工程师都经历过的噩梦。当简单的"永不在此停止"失效时，我们需要更高级的技术手段来应…...
SEO_ 揭秘影响搜索引擎排名的核心因素与算法
SEO核心因素解析：揭秘影响搜索引擎排名的算法 在互联网时代，搜索引擎优化（SEO）已成为每一个网站运营者的重要关注点。SEO不仅关系到网站的流量，更直接影响到网站的知名度和商业价值。究竟有哪些核心因素和算法影响着搜…...