两个圆形 一个z里面一个z外面,z里面的大,颜色不同 html

两个圆形 一个z里面一个z外面,z里面的大,颜色不同 html

html 复制代码
<!DOCTYPE html>
<html>
<head>
<style>
.outer-circle {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background-color: #ff9999; /* 外圆的颜色 */
  position: relative;
}

.inner-circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #99ff99; /* 内圆的颜色 */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* 两个圆形 一个z里面一个z外面,z里面的大,颜色不同 html */
</style>
</head>
<body>

<div class="outer-circle">
  <div class="inner-circle"></div>
</div>

</body>
</html>
相关推荐
洛小豆4 小时前
前端开发必备:三种高效定位动态类名元素的 JavaScript 技巧
开发语言·前端·javascript·面试
啵一杯4 小时前
leetcode621. 任务调度器
服务器·前端·数据结构·算法·c#
2401_857297915 小时前
2025校招内推-招联金融
java·前端·算法·金融·求职招聘
琴~~6 小时前
前端全屏模式切换
前端·javascript
东方小月6 小时前
JavaScript中的随机函数Random的妙用
前端·javascript
林九生7 小时前
【React】(推荐项目)使用 React、Socket.io、Nodejs、Redux-Toolkit、MongoDB 构建聊天应用程序 (2024)
前端·mongodb·react.js
每天吃饭的羊7 小时前
ConstructorParameters
前端
Jiaberrr7 小时前
微信小程序攻略:如何验证Token是否即将失效并自动刷新
前端·javascript·微信小程序·小程序·前端框架
子非鱼9217 小时前
【前端】ES9:ES9新特性
前端·javascript·es9