<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="信件style.css">
<title>回信</title>
</head>
<body>
<address class="sender-column">
中国北京市门头沟区,102300<br>
纽臂大学 纽臂科学院<br>
<strong>李雷 </strong>教授<br>
<em>联系电话:123-456-7890</em><br>
<em>电子邮件:no_reply@example.com</em><br>
</address>
<p><time class="sender-column" datetime="2019年2月22日">2019 年 2 月 22 日</time></p>
<h1>回复:韩梅梅学位申请</h1>
<p>亲爱的韩同学:</p>
<p>感谢你申请纽臂大学科学院的哲学博士学位课程,下面我将就你的问题依次做出解答。</p>
<h2>开学日期</h2>
<p>欢迎你在任意时间来校学习,但在学期开始时来校更理想,每学期开学时间如下:</p>
<ul>
<li>第一学期:<time datetime="2019年9月9日">2019 年 9 月 9 日</time></li>
<li>第二学期:<time datetime="2020年1月15日">2020 年 1 月 15 日</time></li>
<li>第三学期:<time datetime="2020年5月2日">2020 年 5 月 2 日</time></li>
</ul>
<p>请告诉我你是否愿意在学期开始时来校,并告知你选择的学期。</p>
<p>你可以在我们的网站上找到更多关于 <a href="#">学校重要日期</a> 的信息。</p>
<h2>学习科目</h2>
<p>纽臂科学院本着兼容并蓄的原则,课题涉及一些科技领域。欢迎有才智、态度专注的研究人员参加,也欢迎符合我们价值观的朋友加入。我们最感兴趣的课题如下(按优先度排序):</p>
<ol>
<li>把水(H<sub>2</sub>O)转变为酒的方法,以及白藜芦醇(C1<sub>4</sub>H<sub>12</sub>O<sub>3</sub>)对健康的帮助作用。</li>
<li>测量室温 30°C(86°F)时,观众人数呈指数级增加对放克贝斯手表演的影响(3 × 10<sup>3</sup> > 3 × 10<sup>4</sup> 效应)。</li>
<li>使用<abbr title="HTML"> HTML</abbr> 和<abbr title="CSS" >CSS</abbr> 构建乐谱。</li>
</ol>
<p>请针对上述课题提供更多的信息。包括研究时长、所需资源,以及其它未尽事宜,谢谢。</p>
<h2>异域舞蹈</h2>
<p>你说的没错!异域部落舞蹈是我博士后研究项目的一部分。为了回答你的问题,我在下面列出我个人最喜欢的舞蹈种类和相关介绍:</p>
<dl>
<dt>波利尼西亚小鸡舞</dt>
<dd>一种古老、神秘但影响广泛的舞蹈,可追溯至公元前 300 年,整个村庄围绕着一个小鸡形状的圈跳舞,祈祷牲畜肥美。</dd>
<dt>冰岛布尔曳步舞。</dt>
<dd>在冰岛人学会用火取暖之前,他们之间流行着这种舞蹈,舞蹈时人们在地上拥成一个圈,用极小极快的动作晃动身体。我有一个学生说冰岛曳步舞是现代甩臀舞的鼻祖。</dd>
<dt>北极机器人舞</dt>
<dd>一个有趣的历史误传,二十世纪六十年代的英国探险者宣称发现了一种像“机器人跳舞”的舞蹈,这种舞蹈动作僵硬,流行于加拿大和阿拉斯加北部地区。后来人们发现这里的居民是因为天气太冷了才做出这样的动作。</dd>
</dl>
<p>更多信息请查看我的<a href="#"> 异域舞蹈研究</a> 网页。</p>
<p>李雷 教授</p>
<p>纽臂大学校训:<q>人人皆可纽臂</q> —— 诸葛中天传</p>
</body>
</html>
问题:
- 元数据表示作者没有表示出来
- 2019年2月22日没有靠右书写,因为将class属性写在了time标签中,若写在p标签中就没有问题。为什么?
- time标签中的datetime="2019-02-22"到底有什么用,为什么写2019-2-22和2019年2月22日,显示是一样的?
- 纠结第二组地址要用什么标签,结果是用address
- <a>标签除了href属性,还可以添加title属性
- “>”大于号应该用>;表示,没有注意到,但是浏览器显示没有问题,为什么?
- 最后的标语应该用<cite&gy;标签标记成引文。
- css文件可以直接用<style>标签围起来放在html文件中,也可以用link。
修改后的代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="李雷">
<!-- <link rel="stylesheet" href="信件style.css"> -->
<style>
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;
}
</style>
<title>回信</title>
</head>
<body>
<address class="sender-column">
中国北京市门头沟区,102300<br>
纽臂大学 纽臂科学院<br>
<strong>李雷 </strong>教授<br>
<em>联系电话:123-456-7890</em><br>
<em>电子邮件:no_reply@example.com</em><br>
</address>
<p class="sender-column">
<time datetime="2019年2月22日">2019 年 2 月 22 日
</time>
</p>
<address>
中国海南省三亚市亚龙湾<br>
<strong>韩梅梅 女士</strong>
</address>
<h1>回复:韩梅梅学位申请</h1>
<p>亲爱的韩同学:</p>
<p>感谢你申请纽臂大学科学院的哲学博士学位课程,下面我将就你的问题依次做出解答。</p>
<h2>开学日期</h2>
<p>欢迎你在任意时间来校学习,但在学期开始时来校更理想,每学期开学时间如下:</p>
<ul>
<li>第一学期:<time datetime="2019年9月9日">2019 年 9 月 9 日</time></li>
<li>第二学期:<time datetime="2020年1月15日">2020 年 1 月 15 日</time></li>
<li>第三学期:<time datetime="2020年5月2日">2020 年 5 月 2 日</time></li>
</ul>
<p>请告诉我你是否愿意在学期开始时来校,并告知你选择的学期。</p>
<p>你可以在我们的网站上找到更多关于 <a href="#" title="纽臂大学大事时间表">学校重要日期</a> 的信息。</p>
<h2>学习科目</h2>
<p>纽臂科学院本着兼容并蓄的原则,课题涉及一些科技领域。欢迎有才智、态度专注的研究人员参加,也欢迎符合我们价值观的朋友加入。我们最感兴趣的课题如下(按优先度排序):</p>
<ol>
<li>把水(H<sub>2</sub>O)转变为酒的方法,以及白藜芦醇(C1<sub>4</sub>H<sub>12</sub>O<sub>3</sub>)对健康的帮助作用。</li>
<li>测量室温 30°C(86°F)时,观众人数呈指数级增加对放克贝斯手表演的影响(3 × 10<sup>3</sup> > 3 × 10<sup>4</sup> 效应)。</li>
<li>使用<abbr title="超文本标记语言(HyperText Markup Language)"> HTML</abbr> 和<abbr title="层叠样式表(Cascading Style Sheets" >CSS</abbr> 构建乐谱。</li>
</ol>
<p>请针对上述课题提供更多的信息。包括研究时长、所需资源,以及其它未尽事宜,谢谢。</p>
<h2>异域舞蹈</h2>
<p>你说的没错!异域部落舞蹈是我博士后研究项目的一部分。为了回答你的问题,我在下面列出我个人最喜欢的舞蹈种类和相关介绍:</p>
<dl>
<dt>波利尼西亚小鸡舞</dt>
<dd>一种古老、神秘但影响广泛的舞蹈,可追溯至公元前 300 年,整个村庄围绕着一个小鸡形状的圈跳舞,祈祷牲畜肥美。</dd>
<dt>冰岛布尔曳步舞。</dt>
<dd>在冰岛人学会用火取暖之前,他们之间流行着这种舞蹈,舞蹈时人们在地上拥成一个圈,用极小极快的动作晃动身体。我有一个学生说冰岛曳步舞是现代甩臀舞的鼻祖。</dd>
<dt>北极机器人舞</dt>
<dd>一个有趣的历史误传,二十世纪六十年代的英国探险者宣称发现了一种像“机器人跳舞”的舞蹈,这种舞蹈动作僵硬,流行于加拿大和阿拉斯加北部地区。后来人们发现这里的居民是因为天气太冷了才做出这样的动作。</dd>
</dl>
<p>更多信息请查看我的<a href="#" title="李雷的异域舞蹈研究站点"> 异域舞蹈研究</a> 网页。</p>
<p>李雷 教授</p>
<p>纽臂大学校训:<q>人人皆可纽臂</q> —— <cite>诸葛中天传</cite></p>
</body>
</html>
显示样式: