随便用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>
相关推荐
少油少盐不要辣12 分钟前
前端如何处理AI模型返回的流数据
前端·javascript·人工智能
IT_陈寒15 分钟前
Java21新特性实战:5个杀手级改进让你的开发效率提升40%
前端·人工智能·后端
跟着珅聪学java15 分钟前
以下是使用JavaScript动态拼接数组内容到HTML的多种方法及示例:
开发语言·前端·javascript
BD_Marathon18 分钟前
NPM_配置的补充说明
前端·npm·node.js
巴拉巴拉~~23 分钟前
KMP 算法通用图表组件:KmpChartWidget 多维度可视化 + PMT 表渲染 + 性能对比
前端·javascript·microsoft
智算菩萨29 分钟前
基于spaCy的英文自然语言处理系统:低频词提取与高级文本分析
前端·javascript·easyui
刘一说39 分钟前
Vue单页应用(SPA)开发全解析:从原理到最佳实践
前端·javascript·vue.js
疯狂成瘾者40 分钟前
前端vue核心知识点
前端·javascript·vue.js
Laravel技术社区2 小时前
用PHP8实现斗地主游戏,实现三带一,三带二,四带二,顺子,王炸功能(第二集)
前端·游戏·php
m0_738120723 小时前
应急响应——知攻善防Web-3靶机详细教程
服务器·前端·网络·安全·web安全·php