スキルテスト: HTML テキストの基礎

このスキルテストの目的は、あなたが HTML でのテキストのマークアップを行う方法を理解しているかどうかを評価することです。

メモ: 以下の対話型エディターで解決に挑戦することができます。ただし、コードをダウンロードし、CodePenjsFiddleGlitchなどのオンラインツールを使用して作業することが便利な場合もあります。

行き詰まったら、助けを求めましょう。このページの最下部の評価またはさらなるヘルプの節をご覧ください。

課題 1

この課題では、与えられた HTML を意味づけされた見出しと段落要素を使用してマークアップしていただきます。

完成例はこのようになるはずです。

下記のライブコードを更新して、完成例を再現してみてください。

自分のエディターやオンラインエディターで作業する場合は、この課題の開始時点のものをダウンロードしましょう。

課題 2

この課題では、最初のマークアップされていないリストを順序なしリストに、2 つ目のリストを順序付きリストに変えていただきます。

完成例はこのようになるはずです。

下記のライブコードを更新して、完成例を再現してみてください。

自分のエディターやオンラインエディターで作業する場合は、この課題の開始時点のものをダウンロードしましょう。

課題 3

この課題では、1 つの段落が提供されています。目標は、インライン要素を使用して、強い重要性を持つ適切な単語と、強調された単語をいくつかマークアップすることです。

完成例はこのようになるはずです。

下記のライブコードを更新して、完成例を再現してみてください。

自分のエディターやオンラインエディターで作業する場合は、この課題の開始時点のものをダウンロードしましょう。

評価またはさらなるヘルプ

この例は、上記のインタラクティブエディターで練習することができます。

この作品を評価してほしい、行き詰っているので相談に乗ってほしいという方は次のようにしてください。

  1. 作品をオンラインの共有可能なエディター、例えば CodePenjsFiddleGlitch に置いてください。コードは自分で書いても、上の節でリンクされている開始時点のファイルを使用しても構いません。
  2. MDN Discourse forum 学習カテゴリーに評価や助けを依頼する記事を書いてください。投稿には以下を記載してください。
    • 「HTML テキストの基礎、スキルテスト 1 のための評価希望」のような説明的なタイトル。
    • すでに持っている内容や、私たちに望むことの詳細。例えば、行き詰まって助けが必要な場合や、評価を希望する場合などを指示してください。
    • 評価やヘルプが必要な例へのリンクを、オンライン共有エディターで示してください(上記のステップ 1 で述べたとおり)。コードを見ることができなければ、コーディングの問題で誰かを助けることはとても難しいのです。
    • 実際の課題または評価ページへのリンク。あなたが助けを求めている問題を探すことができます。