技能测试:高级 HTML 文本

此技能测试旨在帮助您评估是否理解如何使用鲜为人知的 HTML 元素来标记高级语义特征

注意: 如需帮助,请阅读我们的“技能测试”使用指南。您也可以通过我们的沟通渠道与我们联系。

任务 1

在此任务中,我们希望您为提供的 HTML 添加一些语义。

要完成此任务

  1. 将第二个段落转换为块级引用,并语义化地指示该引文摘自可访问性
  2. 将“HTML”和“CSS”语义化地标记为缩写词,并提供工具提示中的全称。
  3. 使用下标和上标为化学式和日期提供正确的语义,并使其正确显示。
  4. 将机器可读日期与文本中的日期进行语义关联。

完成后的示例应如下所示:

html
<h1>Advanced text semantics</h1>

<p>Let's start with a quote:</p>

<p>
  HTML, Hypertext Markup Language is by default accessible, if used correctly.
</p>

<p>CSS can also be used to make web pages more, or less, accessible.</p>

<p>Chemical Formulae: H2O (Water), C2H6O (Ethanol).</p>

<p>
  Dates: December 25th 2019 (Christmas Day), November 2nd 2019 (Día de los
  Muertos).
</p>
点击此处显示解决方案

您完成的 HTML 应该看起来像这样

html
<h1>Advanced text semantics</h1>

<p>Let's start with a quote:</p>

<blockquote cite="https://mdn.org.cn/en-US/docs/Learn/Accessibility">
  <p>
    <abbr title="HyperText Markup Language">HTML</abbr>, Hypertext Markup
    Language is by default accessible, if used correctly.
  </p>
</blockquote>

<p>
  <abbr title="Cascading Style Sheets">CSS</abbr>, Cascading Style Sheets, can
  also be used to make web pages more, or less, accessible.
</p>

<p>
  Chemical Formulae: H<sub>2</sub>O (Water), C<sub>2</sub>H<sub>6</sub>O
  (Ethanol).
</p>

<p>
  Dates:
  <time datetime="2019-12-25">December 25<sup>th</sup> 2019</time>
  (Christmas Day),
  <time datetime="2019-11-02">November 2<sup>nd</sup> 2019</time> (Día de los
  Muertos).
</p>