小草少儿编程_H5/works.html · 约 1737 字符
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"><span class="back"></span><h1>作品广场</h1><span class="right">📤</span></header>
12<div class="section-title">学员作品 <span>今日新增 26 个</span></div>
13<div class="work-grid"></div>
14<script>
15 var wg = document.querySelector('.work-grid');
16 var h3 = '';
17 window.DATA.works.forEach(function (w) {
18 h3 += '<div class="work-item"><div class="wi-img">' + w.img + '</div><div class="wi-name">' + w.name + '</div><div class="wi-like">❤ ' + w.like + '</div></div>';
19 });
20 wg.innerHTML = h3;
21</script>
22<div class="card" style="text-align:center">
23 <div style="font-size:14px;font-weight:700;margin-bottom:6px">上传我的作品</div>
24 <div style="font-size:12px;color:#7fb4ab;margin-bottom:12px">提交代码作品，赢金币和展示位</div>
25 <div class="btn btn-primary" data-toast="作品上传功能即将开放">立即上传</div>
26</div>
27
28<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=" active" href="works.html"><span class="icon">🎨</span>作品</a><a class="" href="report.html"><span class="icon">📈</span>报告</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
29<script src="data.js"></script>
30<script src="app.js"></script>
31</body>
32</html>