随便用css换个渐变的太阳

来源于GPT4o:代码来源

css 复制代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>渐变色上半圆</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            background-color: #f0f0f0;
        }

        .half-circle {
            width: 200px;
            height: 100px;
            background: linear-gradient(to bottom, #ff7e5f, #feb47b); /* 渐变色从上到下 */
            border-top-left-radius: 100px;
            border-top-right-radius: 100px;
            /* 隐藏下半部分 */
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
        }
    </style>
</head>
<body>
    <div class="half-circle"></div>
</body>
</html>
相关推荐
eason_fan14 分钟前
Service Worker 缓存请求:前端性能优化的进阶利器
前端·性能优化
光影少年22 分钟前
rn如何和原生进行通信,是单线程还是多线程,通信方式都有哪些
前端·react native·react.js·taro
好大哥呀42 分钟前
Java Web的学习路径
java·前端·学习
HashTang1 小时前
【AI 编程实战】第 7 篇:登录流程设计 - 多场景、多步骤的优雅实现
前端·uni-app·ai编程
cos1 小时前
Fork 主题如何更新?基于 Ink 构建主题更新 CLI 工具
前端·javascript·git
小满zs1 小时前
Next.js第二十一章(环境变量)
前端·next.js
C***11501 小时前
Spring aop 五种通知类型
java·前端·spring
朝阳392 小时前
前端项目的【package-lock.json】详解
前端
摸鱼的春哥2 小时前
AI编排实战:用 n8n + DeepSeek + Groq 打造全自动视频洗稿流水线
前端·javascript·后端