css实现内凹圆

news2024/11/26 15:33:15

css实现内凹圆

实现效果
在这里插入图片描述
html

<div id="post-form">
	 <div class="formbox"></div>
	 <div class="rightform"></div>
</div>

css 样式

#post-form{
    padding:50px 10px;
    background:#fff;
    margin:30px auto;
    width:90%;
    border-radius:10px;
    position:relative;
}
 .formbox{
      position: absolute;
      top: 50%;
      left:-2px;
      transform: translate(-50%,-50%);
      width: 20px;
      height:20px;
      background:#2EB267;
      z-index:9;
      border-radius:50%;
 }
   .rightform{
        position: absolute;
        top: 50%;
        right:-23px;
        transform: translate(-50%,-50%);
        width: 20px;
        height:20px;
        background:#2EB267;
        z-index:9;
        border-radius:50%;
   }

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

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

相关文章

vue3+element-plus权限控制实现(el-tree父子级不关联情况处理)

文章目录 前言一、遇到的交互场景el-tree 中 check-strictly 属性 二、处理父级的半选中以及选中交互el-treecheck&#xff0c;check-change 事件编辑进来&#xff0c;父级的半选状态处理 总结 前言 在开发后台管理系统的时候&#xff0c;用户的权限控制是一个常见的需求。这里…

NLP中的文本分类、实体识别、关系识别和三元组识别

在自然语言处理&#xff08;NLP&#xff09;领域&#xff0c;文本分类、实体识别、关系识别和三元组识别是重要的主题。本文将深入探讨这些关键问题&#xff0c;并介绍相关算法和技术。 文本分类 首先&#xff0c;我们关注文本分类。不同的文本分类算法和技术被详细介绍&…

事务隔离级别是怎么实现的?

事务有哪些特性&#xff1f; 事务是由 MySQL 的引擎实现的&#xff0c;我们常见的 InnoDB引擎时支持事务的。 不过并不是所有的引擎都支持事务&#xff0c;比如 MySQL原生的 MyISAM 引擎就不支持事务&#xff0c;正因为如此&#xff0c;大多数MySQL的引擎都是用 InnoDB。 事…

Docker进阶:Docker轻量级可视化工具Portainer与容器监控3剑客CAdvisor+InfluxDB+Granfana

Docker进阶&#xff1a;Docker轻量级可视化工具Portainer与容器监控3剑客CAdvisorInfluxDBGranfana 一、Docker轻量级可视化工具Portainer1.1、Portainer简介1.2、安装Portainer1.2.1、安装Portainer的Docker镜像1.2.2、访问Portainer Web界面1.2.3、连接到Docker守护进程 1.3、…

SpringBoot整合Zookeeper做分布式锁

环境准备 zookeeper准备 首先你需要一个zookeeper服务器&#xff0c;或者是一个zookeeper集群。我已经准备好了一个zookeeper集群&#xff0c;如图&#xff1a; 当然一个单节点的zookeeper也可以搭建分布式锁。如果你还没有zookeeper&#xff0c;那么你可以参考我写的搭建z…

华为云云耀云服务器L实例评测|轻量级应用服务器对决:基于 Geekbench 深度测评华为云云耀云服务器L实例

本文收录在专栏&#xff1a;#云计算入门与实践 - 华为云 专栏中&#xff0c;本系列博文还在更新中 相关华为云云耀云服务器L实例评测文章列表如下&#xff1a; 华为云云耀云服务器L实例评测 | 从零开始&#xff1a;云耀云服务器L实例的全面使用解析指南 华为云云耀云服务器L实…

某计费管理系统任意文件读取漏洞

文章目录 声明一、漏洞描述二、漏洞复现声明 请勿利用文章内的相关技术从事非法测试,由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失,均由使用者本人负责,所产生的一切不良后果与文章作者无关。该文章仅供学习用途使用。 一、漏洞描述 蓝海…

Apache解析漏洞复现

一、多后缀解析漏洞 1.漏洞说明 配置apache时&#xff0c;对于apache配置不熟练&#xff0c;配置命令不清楚&#xff0c;在配置PHP文件处理程序时&#xff0c;配置命令存在问题&#xff1a;位于漏洞环境目录的 conf/docker-php.conf里的配置命令&#xff08;AddHandler applica…

uni-datetime-picker组件填坑,在mounted后再赋值calendar日历不展示或错误展示回显的日期。

当需求存在tab切换展示uni-datetime-picker&#xff0c;且每次切换需要初始化默认选中日期的时候&#xff0c;就会出现这样的bug。 就以两个不同类型的日期选择框进行切换展示为例&#xff1a; 没填坑之前的代码&#xff1a; <uni-datetime-picker v-show"activeTab…

使用BWGS进行基因型数据预测

标题&#xff1a;小麦基因组选择育种通道方法 描述&#xff1a;专门为小麦全基因组选择育种设计的包 编码方式&#xff1a;UTF-8 URL&#xff1a;GitHub - byzheng/BWGS: 2021 BreedWheat Genomic Selection pipeline BugReports &#xff1a;https://github.com/byzheng/B…

Vue2 | Vant uploader实现上传文件和图片

需求&#xff1a; 实现图片和文件的上传&#xff0c;单个图片超过1M则压缩&#xff0c;全部文件加起来不得超过10M。 效果&#xff1a; 1. html <van-form ref"form"><van-field name"uploader" label"佐证材料" required><t…

TypeScript枚举(Enums)和泛型(Generics)

&#x1f3ac; 岸边的风&#xff1a;个人主页 &#x1f525; 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想&#xff0c;就是为了理想的生活 ! 目录 枚举 异构枚举 枚举成员的类型 泛型 1. 函数泛型 2. 接口泛型 3. 类泛型 接下来我们将学习TypeScript 中的两…

无涯教程-JavaScript - ISREF函数

描述 如果指定的值是参考,则ISREF函数返回逻辑值TRUE。否则返回FALSE。 语法 ISREF (value) 争论 Argument描述Required/OptionalvalueA reference to a cell.Required Notes 您可以在执行任何操作之前使用此功能测试单元格的内容。 适用性 Excel 2007,Excel 2010,Exce…

机器故障预测:未来24小时的决胜时刻!!!

一、背景介绍 这个竞赛的焦点是预测机器是否会在未来24小时内故障。数据包括与机器性能相关的各种特征&#xff0c;例如温度、振动、功耗和传感器读数。目标变量是二进制的&#xff0c;表示机器是否在未来24小时内故障&#xff08;1&#xff09;或未故障&#xff08;0&#xf…

计算机竞赛 机器视觉opencv答题卡识别系统

0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 答题卡识别系统 - opencv python 图像识别 该项目较为新颖&#xff0c;适合作为竞赛课题方向&#xff0c;学长非常推荐&#xff01; &#x1f947;学长这里给一个题目综合评分(每项满分5分…

selenium 网页自动化-在访问一个网页时弹出的浏览器窗口,我该如何处理?

前言 相信大家在使用selenium做网页自动化时&#xff0c;会遇到如下这样的一个场景&#xff1a; 在你使用get访问某一个网址时&#xff0c;会在页面中弹出如上图所示的弹出框。 首先想到是利用Alert类来处理它。 然而&#xff0c;很不幸&#xff0c;Alert类处理的结果就是没…

解决java.text.ParseException: Unparseable date: “invalid_date“

解决java.text.ParseException: Unparseable date: "invalid_date" 前言摘要引言正文1. 理解异常的根本原因2. 处理日期字符串格式问题3. 处理非法字符或无效日期信息4. 异常处理 总结参考资料 博主 默语带您 Go to New World. ✍ 个人主页—— 默语 的博客&#x1f…

创造引人入胜的网页体验:掌握 CSS 动画

&#x1f482; 个人网站:【工具大全】【游戏大全】【神级源码资源网】&#x1f91f; 前端学习课程&#xff1a;&#x1f449;【28个案例趣学前端】【400个JS面试题】&#x1f485; 寻找学习交流、摸鱼划水的小伙伴&#xff0c;请点击【摸鱼学习交流群】 在现代网页设计中&#…

Leetcode算法入门与数组丨2. LeetCode入门

文章目录 前言LeetCode 是什么LeetCode 注册LeetCode 学习LeetCode 题库LeetCode 刷题页面 & 刷题语言选择LeetCode 题解LeetCode 刷题流程LeetCode 刷题攻略 前言 Datawhale组队学习丨9月Leetcode算法入门与数组丨打卡笔记 这篇博客是一个 入门型 的文章&#xff0c;主要…

Failed to connect to bitbucket.org port 443 错误原因, 解决办法

最近使用SourceTree来访问bitbucket.org的代码托管Git, 当Pull或者Push发现操作失败: Failed to connect to bitbucket.org port 443 错误原因: 无法链接到网站地址, 可能是DNS解析IP地址错误, 或者网站维护, 大概率是被墙或者DNS解析错误. 解决办法: 如果您的浏览器能够访问b…