css实现内凹圆

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%;
   }
相关推荐
y***54887 分钟前
React依赖
前端·react.js·前端框架
2***B4497 分钟前
React测试
前端·react.js·前端框架
5***o50014 分钟前
React自动化测试
前端·react.js·前端框架
T***u33315 分钟前
React部署
前端·react.js·前端框架
Jing_Rainbow19 分钟前
【AI-7 全栈-2 /Lesson16(2025-11-01)】构建一个基于 AIGC 的 Logo 生成 Bot:从前端到后端的完整技术指南 🎨
前端·人工智能·后端
神秘的猪头28 分钟前
🧱 深入理解栈(Stack):原理、实现与实战应用
前端·javascript·面试
用户29654127591729 分钟前
JSAPIThree UI 控件学习笔记:用内置控件提升交互
前端
明教教主张5G29 分钟前
Vue响应式原理(13)-ref实现原理解析
前端·vue.js
StockPP35 分钟前
印度尼西亚股票多时间框架K线数据可视化页面
前端·javascript·后端
kungggyoyoyo1 小时前
TRAE中国版SOLO模式上线!我用它从0到1开发了一款AI小说编辑器
前端·vue.js·trae