随便用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>
相关推荐
探索前端6 小时前
Cesium图层加载及影像服务添加
前端·cesium
阿懂在掘金6 小时前
Vue 弹窗新范式——代码减少、复用翻倍与 AI 时代的前端基建
前端·设计模式·前端框架
千纸鹤安安6 小时前
Compose Runtime → KuiklyUI:Applier 搭起的渲染桥梁
前端
李明卫杭州6 小时前
mise 管理工具详解
前端·后端
颜进强6 小时前
从零搭建私人 RAG 实战:让 Claude Code 按需查询知识库
前端·后端·ai编程
程序员黑豆6 小时前
鸿蒙应用开发:Scroll 组件从入门到实战
前端·华为·harmonyos
a1117767 小时前
三色软糖坠落玻璃池 THreeJS kimi
前端·人工智能·threejs
凤山老林8 小时前
防抖与节流:解决Web前段高频事件,性能优化的”YYDS“
前端·防抖节流
a1117768 小时前
Web 3D 肌肉车展示项目 开源
前端·3d
KaMeidebaby9 小时前
卡梅德生物技术快报|核酸适配体文库筛选:核酸适配体文库筛选全流程技术解析:NGS与AI辅助方案的设计与实践
前端·人工智能·物联网·算法·百度