演習課題「見出しに枠線を付ける」

右側のコードエリアのhtmlは、「hello paiza」という見出しを表示します。
headタグ上のstyleタグにスタイルを追加して、h1タグの枠線(border)を付けてください。プロパティの設定値は、「solid #00A0A0」とします。

コードの実行をして、エラーが出なければ、演習課題クリアです!

期待する出力値


演習課題「bodyの内側に余白を付ける」

右側のコードエリアのhtmlは、「hello paiza」という見出しを表示します。
headタグ上のstyleタグにスタイルを追加して、bodyタグの内側の余白(padding)を100ピクセルにしてください。

コードの実行をして、エラーが出なければ、演習課題クリアです!

期待する出力値


演習課題「見出しの外側に余白を追加する」

右側のコードエリアのhtmlは、「hello paiza」という見出しを表示します。
headタグ上のstyleタグにスタイルを追加して、h1タグのの外側の余白(margin)を80ピクセルにしてください。

コードの実行をして、エラーが出なければ、演習課題クリアです!

期待する出力値


※paizaに会員登録すると無料で動画学習コンテンツをご利用いただけます
会員登録する

#04:CSSのレイアウト指定を理解しよう

ここではCSSを使ったパーツのレイアウトに挑戦します。そのために、CSSを使った余白や間隔の指定方法について学習しましょう。