220 lines
4.4 KiB
HTML
220 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<style>
|
||
html { background: #ffffff; }
|
||
body {
|
||
width: 720pt;
|
||
height: 405pt;
|
||
margin: 0;
|
||
padding: 0;
|
||
background: #F5F1E8;
|
||
font-family: Arial, sans-serif;
|
||
display: flex;
|
||
}
|
||
|
||
.slide-content {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: relative;
|
||
}
|
||
|
||
/* Title */
|
||
.title {
|
||
position: absolute;
|
||
top: 25pt;
|
||
left: 60pt;
|
||
right: 60pt;
|
||
text-align: center;
|
||
}
|
||
|
||
.title h2 {
|
||
font-family: Georgia, serif;
|
||
font-size: 32pt;
|
||
color: #6B2C3E;
|
||
margin: 0;
|
||
}
|
||
|
||
/* Two column layout */
|
||
.two-col {
|
||
position: absolute;
|
||
top: 85pt;
|
||
left: 60pt;
|
||
right: 60pt;
|
||
bottom: 50pt;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.col-left {
|
||
width: 48%;
|
||
background: #ffffff;
|
||
border: 1pt solid #6B2C3E;
|
||
border-radius: 8pt;
|
||
padding: 18pt;
|
||
}
|
||
|
||
.col-right {
|
||
width: 48%;
|
||
background: #ffffff;
|
||
border: 1pt solid #B8974F;
|
||
border-radius: 8pt;
|
||
padding: 18pt;
|
||
}
|
||
|
||
.col-title {
|
||
font-size: 18pt;
|
||
color: #6B2C3E;
|
||
font-weight: bold;
|
||
margin-bottom: 12pt;
|
||
}
|
||
|
||
.col-title p {
|
||
margin: 0;
|
||
padding: 0;
|
||
display: inline;
|
||
}
|
||
|
||
.col-left .icon,
|
||
.col-right .icon {
|
||
font-size: 20pt;
|
||
margin-right: 8pt;
|
||
}
|
||
|
||
.col-left .icon p,
|
||
.col-right .icon p {
|
||
margin: 0;
|
||
padding: 0;
|
||
display: inline;
|
||
}
|
||
|
||
.col-left ul,
|
||
.col-right ul {
|
||
font-size: 13pt;
|
||
color: #4A5568;
|
||
margin: 8pt 0;
|
||
padding-left: 20pt;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.col-left li,
|
||
.col-right li {
|
||
margin-bottom: 6pt;
|
||
}
|
||
|
||
.suggestion-item {
|
||
margin-bottom: 10pt;
|
||
}
|
||
|
||
.suggestion-item .num {
|
||
display: inline-block;
|
||
width: 22pt;
|
||
height: 22pt;
|
||
background: #B8974F;
|
||
color: #F5F1E8;
|
||
border-radius: 50%;
|
||
text-align: center;
|
||
line-height: 22pt;
|
||
font-size: 12pt;
|
||
font-weight: bold;
|
||
margin-right: 8pt;
|
||
vertical-align: middle;
|
||
}
|
||
|
||
.suggestion-item .text {
|
||
display: inline-block;
|
||
vertical-align: middle;
|
||
width: calc(100% - 35pt);
|
||
font-size: 12pt;
|
||
}
|
||
|
||
.ai-rules {
|
||
background: #F5F1E8;
|
||
padding: 10pt;
|
||
border-radius: 6pt;
|
||
margin-top: 10pt;
|
||
font-size: 11pt;
|
||
line-height: 1.4;
|
||
}
|
||
|
||
.ai-rules .yes { color: #2E7D32; }
|
||
.ai-rules .no { color: #C62828; }
|
||
|
||
/* CTA at bottom */
|
||
.cta {
|
||
position: absolute;
|
||
bottom: 40pt;
|
||
left: 60pt;
|
||
right: 60pt;
|
||
text-align: center;
|
||
font-size: 14pt;
|
||
color: #6B2C3E;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.cta p {
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="slide-content">
|
||
<div class="title">
|
||
<h2>电子产品与AI：机遇还是陷阱？</h2>
|
||
</div>
|
||
|
||
<div class="two-col">
|
||
<div class="col-left">
|
||
<div class="col-title"><span class="icon"><p>📱</p></span><p>我观察到的问题</p></div>
|
||
<ul>
|
||
<li>使用时间越来越长</li>
|
||
<li>有学生作业不想思考，直接用AI生成答案</li>
|
||
<li>影响：
|
||
<ul style="margin-top: 4pt;">
|
||
<li>独立思考能力下降</li>
|
||
<li>学习效果打折扣</li>
|
||
<li>考试时无法依赖工具</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="col-right">
|
||
<div class="col-title"><span class="icon"><p>💪</p></span><p>我们的行动计划</p></div>
|
||
|
||
<div class="suggestion-item">
|
||
<span class="num">1</span>
|
||
<span class="text"><strong>时间管理</strong> 控制每天电子产品使用时间</span>
|
||
</div>
|
||
|
||
<div class="suggestion-item">
|
||
<span class="num">2</span>
|
||
<span class="text"><strong>明确用途</strong> 学习用途 vs 娱乐用途分开</span>
|
||
</div>
|
||
|
||
<div class="ai-rules">
|
||
<span class="num">3</span> <strong>AI正确使用</strong><br/>
|
||
<span class="yes">可以：作文类修改（检查语法、优化表达）</span><br/>
|
||
<span class="no">不可以：直接生成答案，不经思考</span>
|
||
</div>
|
||
|
||
<div class="suggestion-item">
|
||
<span class="num">4</span>
|
||
<span class="text"><strong>家长监督</strong> 检查作业时留意是否独立完成</span>
|
||
</div>
|
||
|
||
<div class="suggestion-item">
|
||
<span class="num">5</span>
|
||
<span class="text"><strong>开放沟通</strong> 如果发现问题，及时与老师联系</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="cta">
|
||
<p>"从今天开始，我们一起建立健康的学习习惯"</p>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|