课程代码
This commit is contained in:
93
web_test/test1/plan.html
Normal file
93
web_test/test1/plan.html
Normal file
@@ -0,0 +1,93 @@
|
||||
<!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>
|
||||
59
web_test/test1/poem.html
Normal file
59
web_test/test1/poem.html
Normal file
@@ -0,0 +1,59 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: "宋体", SimSun, serif;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
p {
|
||||
text-indent: 2em;
|
||||
}
|
||||
h2 {
|
||||
text-align: center;
|
||||
}
|
||||
.poem {
|
||||
text-align: center;
|
||||
margin: 30px 0;
|
||||
font-size: 18px;
|
||||
line-height: 2;
|
||||
}
|
||||
hr {
|
||||
border: 1px solid #ccc;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>李白《静夜思》赏析</h1>
|
||||
<p>《静夜思》是唐代诗人李白的经典诗作,它短小精悍,却蕴含着深深的思乡之情。</p>
|
||||
|
||||
<h2>原诗内容</h2>
|
||||
|
||||
<div class="poem">
|
||||
<p><strong>床前</strong>明月光,</p>
|
||||
<p>疑是地上霜。</p>
|
||||
<p>举头<sup>①</sup>望明月,</p>
|
||||
<p><em>低头思故乡</em>。</p>
|
||||
</div>
|
||||
|
||||
<p>在诗中,“床前”这个词被加粗(床前),起到了一定的强调作用,让读者首先注意到诗人所处的位置。<br>
|
||||
而“疑是地上霜”这句诗,通过“霜”这个字形象地描绘出月光的皎洁清冷,仿佛地上结了一层霜,这种感觉通过简单的文字就传达给了读者。<br>
|
||||
当诗人“举头<sup>①</sup>望明月”时,这里的上标数字<sup>①</sup>可以用来做注释标记,表示对“举头”这个动作可能存在的特殊解读或者引用来源等,明月成为了引发思乡之情的重要媒介。<br>
|
||||
最后“低头思故乡”,诗人<em>深沉地(用em标签表示情感上的强调)</em>陷入对故乡的思念之中。</p>
|
||||
<hr>
|
||||
<p>这首诗虽然没有华丽的辞藻,但每一个字都像是经过精心雕琢,<strong>强烈地(用strong标签表示语义上的强调)</strong>触动着读者内心深处的思乡情感,成为了千古流传的佳作。</p>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user