💻 代码预览 · 小草少儿编程

1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8"/>
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
6<title>学习报告 · 小草少儿编程</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<header class="header"><a class="back" onclick="history.back()">‹</a><h1>学习报告</h1><span class="right"></span></header>
12<div class="section-title">能力雷达</div>
13<div class="radar-box">
14  <div class="radar"><b>82<small>综合分</small></b></div>
15</div>
16<div class="stat-grid">
17  <div class="sg-item"><b>42</b><span>学习天数</span></div>
18  <div class="sg-item"><b>18</b><span>完成作品</span></div>
19  <div class="sg-item"><b>1,280</b><span>金币</span></div>
20</div>
21<div class="section-title">能力维度</div>
22<div class="card" style="margin-top:0">
23  <div class="skill-row"><span>逻辑思维</span><div class="sr-bar"><i style="width:88%"></i></div><span style="font-size:12px;color:#10b981">88</span></div>
24  <div class="skill-row"><span>创造力</span><div class="sr-bar"><i style="width:92%"></i></div><span style="font-size:12px;color:#10b981">92</span></div>
25  <div class="skill-row"><span>专注力</span><div class="sr-bar"><i style="width:76%"></i></div><span style="font-size:12px;color:#f97316">76</span></div>
26  <div class="skill-row"><span>动手能力</span><div class="sr-bar"><i style="width:84%"></i></div><span style="font-size:12px;color:#10b981">84</span></div>
27  <div class="skill-row"><span>表达力</span><div class="sr-bar"><i style="width:80%"></i></div><span style="font-size:12px;color:#10b981">80</span></div>
28</div>
29<div class="card">
30  <div style="font-size:13px;font-weight:700;margin-bottom:8px">📊 本月学习小结</div>
31  <div style="font-size:12px;color:#7fb4ab;line-height:1.8">本月完成 6 个关卡、2 个作品，专注力较上月提升 12%。建议每周增加 1 次作品创作，提升创造力与表达力。</div>
32</div>
33
34<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="courses.html"><span class="icon">📚</span>课程</a><a class="" href="classroom.html"><span class="icon">✏️</span>课堂</a><a class="" href="works.html"><span class="icon">🎨</span>作品</a><a class=" active" href="report.html"><span class="icon">📈</span>报告</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
35<script src="data.js"></script>
36<script src="app.js"></script>
37</body>
38</html>