93 lines
2.6 KiB
HTML
93 lines
2.6 KiB
HTML
<!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 {
|
||
font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
|
||
max-width: 800px;
|
||
margin: 0 auto;
|
||
padding: 20px;
|
||
line-height: 1.6;
|
||
background-color: #f5f5f5;
|
||
}
|
||
h1 {
|
||
text-align: center;
|
||
color: #2c3e50;
|
||
margin-bottom: 30px;
|
||
}
|
||
.section {
|
||
background-color: white;
|
||
padding: 20px;
|
||
margin: 20px 0;
|
||
border-radius: 8px;
|
||
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
||
}
|
||
h2 {
|
||
color: #3498db;
|
||
border-left: 4px solid #3498db;
|
||
padding-left: 10px;
|
||
}
|
||
ol, ul {
|
||
margin-left: 20px;
|
||
}
|
||
li {
|
||
margin: 10px 0;
|
||
}
|
||
a {
|
||
color: #e74c3c;
|
||
text-decoration: none;
|
||
}
|
||
a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
.copyright {
|
||
text-align: center;
|
||
margin: 30px 0;
|
||
color: #7f8c8d;
|
||
}
|
||
.rest-img {
|
||
text-align: center;
|
||
margin: 20px 0;
|
||
}
|
||
.rest-img img {
|
||
max-width: 300px;
|
||
border-radius: 10px;
|
||
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1>我的待办事项与学习资源</h1>
|
||
|
||
<div class="section">
|
||
<h2>本周学习计划（周一至周三）</h2>
|
||
<ol>
|
||
<li>周一：学习HTML基础标签和语法</li>
|
||
<li>周二：练习CSS基础样式和布局</li>
|
||
<li>周三：完成第一次实验作业并复习</li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h2>学习资源网站（周四至周六）</h2>
|
||
<ul>
|
||
<li><a href="https://www.w3schools.com" target="_blank">W3Schools在线教程</a></li>
|
||
<li><a href="https://developer.mozilla.org" target="_blank">MDN Web文档</a></li>
|
||
<li><a href="https://www.runoob.com" target="_blank">菜鸟教程</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="copyright">
|
||
<p>版权所有 © [施光甲]</p>
|
||
</div>
|
||
|
||
<div class="rest-img">
|
||
<!-- 这里使用一个在线图片作为示例，实际使用时请替换为本地图片 -->
|
||
<img src="..\images\relax.png" alt="周日休息图片">
|
||
<p><em>周日：休息放松，为下一周做好准备</em></p>
|
||
</div>
|
||
</body>
|
||
</html> |