HTML纯文本部分 应用dd dt dl ul ii ol等标签
<!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 ></style>
<link type="text/css" rel="stylesheet" href="2.foemat.css">
</head>
<body>
<p class="sender-column italic">
<em>中国北京市门头沟区，102300<br>
纽臂大学 纽臂科学院<br>
<strong>李雷 教授</strong><br>
<stron>联系电话</stron>：123-456-7890<br>
<strong>电子邮件</strong>：no_reply@example.com</em>
</p>
<p class="sender-column ">
<time datatime="2019-02-22日">2019 年 2 月 22 日</time>
</p>
<p class="italic">
<strong><em>韩梅梅 女士</em></strong>
</p>
<address><p class="italic">中国海南省三亚市亚龙湾
</p></address>
<br><br>
<h1>回复：韩梅梅学位申请</h1>
<p>亲爱的韩同学：</p><br>
<p>感谢你申请纽臂大学科学院的哲学博士学位课程，下面我将就你的问题依次做出解答。</p>
<h2>开学日期</h2>
<p>欢迎你在任意时间来校学习，但在学期开始时来校更理想，每学期开学时间如下：</p>
<ul>
<li>第一学期：<time datatime="2019-09-09">2019 年 9 月 9 日</time></li>
<li>第二学期：<time datatime="2020-01-15">2020 年 1 月 15 日</time></li>
<li>第三学期：<time datatime="2020-05-02">2020 年 5 月 2 日</time></li>
</ul>
<p>请告诉我你是否愿意在学期开始时来校，并告知你选择的学期。</p><br>
<p>你可以在我们的网站上找到更多关于 <a href="#">学校重要日期</a> 的信息。</p>
<br>
<h2>学习科目</h2>
<p>纽臂科学院本着兼容并蓄的原则，课题涉及一些科技领域。欢迎有才智、态度专注的研究人员参加，也欢迎符合我们价值观的朋友加入。我们最感兴趣的课题如下（按优先度排序）：</p>
<ul>
<ol>把水（H2O）转变为酒的方法，以及白藜芦醇（C14H12O3）对健康的帮助作用。</ol>
<ol>测量室温 30°C（86°F）时，观众人数呈指数级增加对放克贝斯手表演的影响（3 × 103 > 3 × 104 效应）。</ol>
<ol>使用 HTML 和 CSS 构建乐谱。</ol>
</ul>
<p>请针对上述课题提供更多的信息。包括研究时长、所需资源，以及其它未尽事宜，谢谢。</p><br>
<h2>异域舞蹈</h2>
<p>你说的没错！异域部落舞蹈是我博士后研究项目的一部分。为了回答你的问题，我在下面列出我个人最喜欢的舞蹈种类和相关介绍：</p>
<br>
<dl>
<dt>波利尼西亚小鸡舞</dt>
<dd>一种古老、神秘但影响广泛的舞蹈，可追溯至公元前 300 年，整个村庄围绕着一个小鸡形状的圈跳舞，祈祷牲畜肥美。</dd>
<dt>冰岛布尔曳步舞</dt>
<dd>在冰岛人学会用火取暖之前，他们之间流行着这种舞蹈，舞蹈时人们在地上拥成一个圈，用极小极快的动作晃动身体。我有一个学生说冰岛曳步舞是现代甩臀舞的鼻祖。</dd>
<dt>北极机器人舞</dt>
<dd>一个有趣的历史误传，二十世纪六十年代的英国探险者宣称发现了一种像“机器人跳舞”的舞蹈，这种舞蹈动作僵硬，流行于加拿大和阿拉斯加北部地区。后来人们发现这里的居民是因为天气太冷了才做出这样的动作。</dd>
</dl>
<p>更多信息请查看我的 <a href="#">异域舞蹈研究</a> 网页。</p>
<br>
<p>李雷 教授</p>
<p>纽臂大学校训：<q>人人皆可纽臂</q> —— <cite>诸葛中天传</cite></p>>
</body>
</html>`在这里插入代码片`
PS：文中所用均为虚拟超链接
CSS部分
body {
max-width: 800px;
margin: 0 auto;
}
.sender-column {
text-align: right;
}
h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.3em;
}
p,ul,ol,dl,address {
font-size: 1.1em;
}
p, li, dd, dt, address {
line-height: 1.5;
}
