freeCodeCamp/curriculum/challenges/japanese/01-responsive-web-design/basic-css/inherit-styles-from-the-body-element.md

id, title, challengeType, videoUrl, forumTopicId, dashedName

id	title	challengeType	videoUrl	forumTopicId	dashedName
bad87fee1348bd9aedf08746	Body 要素からスタイルを継承する	0	https://scrimba.com/c/c9bmdtR	18204	inherit-styles-from-the-body-element

--description--

すべての HTML ページに body 要素があることと、body 要素も CSS でスタイルを変更できることが確認できました。

body 要素も他の HTML 要素と同じようにスタイルを変更できることと、他のすべての要素は body 要素のスタイルを継承することを覚えておきましょう。

--instructions--

まず、Hello World というテキストを持つ h1 要素を作成します。

次に、body 要素のスタイル宣言に color: green; を追加して、あなたのページにあるすべての要素の文字色を green にしましょう。

最後に、body 要素のスタイル宣言に font-family: monospace; を追加して、body 要素の font-family を monospace にしましょう。

--hints--

h1 要素を作成してください。

assert($('h1').length > 0);

h1 要素のテキストは Hello World でなければなりません。

assert(
  $('h1').length > 0 &&
    $('h1')
      .text()
      .match(/hello world/i)
);

h1 要素には終了タグが必要です。

assert(
  code.match(/<\/h1>/g) &&
    code.match(/<h1/g) &&
    code.match(/<\/h1>/g).length === code.match(/<h1/g).length
);

body 要素の color プロパティを green に設定してください。

assert($('body').css('color') === 'rgb(0, 128, 0)');

body 要素の font-family プロパティを monospace に設定してください。

assert(
  $('body')
    .css('font-family')
    .match(/monospace/i)
);

h1 要素は、body 要素から monospace フォントを継承しているはずです。

assert(
  $('h1').length > 0 &&
    $('h1')
      .css('font-family')
      .match(/monospace/i)
);

h1 要素は、body 要素から文字色 green を継承しているはずです。

assert($('h1').length > 0 && $('h1').css('color') === 'rgb(0, 128, 0)');

--seed--

--seed-contents--

<style>
  body {
    background-color: black;
  }

</style>

--solutions--

<style>
  body {
    background-color: black;
    font-family: monospace;
    color: green;
  }

</style>
<h1>Hello World!</h1>