演習課題「内部スタイルシートを利用してみよう」
現在、内部スタイルシートを利用してh1要素とp要素の文字に色をつけようとしています。
文字に色をつけるため、head要素内にstyle要素を記述してください。
その際、プロパティにはcolorを使用します。
また、値としてh1要素には#f5a1b3を、p要素には#c79163を指定してください。
採点の前にはファイルを保存してください。
採点して、ジャッジに正解すれば演習課題クリアです!
#02:内部スタイルシートの適用
このチャプターでは、内部スタイルシートの適用について学習します。
内部スタイルシートはHTML文書のhead要素内にstyle要素のコンテンツとして、直接スタイルシートを記述したものを指します。
「このページのここのスタイルだけ変えたい」というように、部分的にスタイルを優先指定する場合には便利ですが、1つのスタイルシートに1つのHTML文書しか対応しないためメンテナンス性能が低くなるという欠点があります。そのため、一般には外部スタイルシートを作成してlinkタグで適用することが推奨されています。
MDN web docs
https://developer.mozilla.org/ja/docs/Learn_web_development/Core/Styling_basics/Getting_started#%E5%86%85%E9%83%A8%E3%82%B9%E3%82%BF%E3%82%A4%E3%83%AB%E3%82%B7%E3%83%BC%E3%83%88
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>内部スタイルシート</title>
<style>
h1 {color: red;}
p {color: blue;}
</style>
</head>
<body>
<article>
<h1>内部スタイルシートを設定する</h1>
<p>style要素を用いて内部スタイルシートを設定できます</p>
</article>
</body>
</html>