WEB制作/背景の色が変わらない

実現したいこと

・背景の色を変える
・sanitize.cssが適用されているか知りたい

詳細

私は「HTML&SCC,JavaScriptのきほんのきほん」と言う本を読みながらWEBサイトの作成をしています。
昨日から読み始め、初めてプログラミングというものに触れた初心者です。
初歩的な質問になりますが、教えていただけますと幸いです。

本の指示通りにコードを入力しましたが、背景の色が変わりません。
また、sanitize.cssを外部参照できているか分かりません。本には余計な装飾を取り除いてくれると書いてありますが、何も変わりません。

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <mete name="viewport" content="width=device-width">
      <title>入会申込み</title>
      <link rel="stylesheet" href="css/@import url(sanitize.css);style.css">

</head>
<body> 
  <div class="content">
 <h1> 入会申込み</h1>
<P>入会するには、次のホームに必要事項をご記入ください。</P>
<P>メールアドレス：<input type="email" name="mymail"></P>
<P>パスワード:<input type="password" name="passcode"></P>
<p><button type="submit">登録する</button></p>
</div>
</body>
</html>
　
ここからはstyle.cssのコードです。

h1{
    font-size: 24px;
    margin: 0;
}
.content {
    background-color: #fcc;
    width:  600px;
}




### 試したこと

色を#f㏄からblueに変えたりしてみましたが、変化がありません。

### 補足情報（FW/ツールのバージョンなど）

VScodesを使っています。

行動規範の内容に同意します

回答1件

style.cssはどこに配置してますか?
(3)が良いと思います。

(1)ローカルなら
htmlから参照が必要です。

<head></head>内に <link rel="stylesheet" href="style.css" media="all" /> を追記してください。フォルダ構造によっては href="style.css"はhref="css/style.css"かもしれません。

(2)不明なら1
sanitize.cssは https://csstools.github.io/sanitize.css/ の事だと予想します。

(3)不明なら2
いっその事これではどうでしょう
htmlと同じフォルダ内に
style.cssを作り以下を記載。
h1{
font-size: 24px;
margin: 0;
}
.content {
background-color: #fcc;
width: 600px;
}
html側は7行目を以下に差し替え

投稿2023/03/11 03:56

magarugi

総合スコア17

kinakomotimoti

2023/03/11 04:35

ご回答、ありがとうございます。教えていただいた（１）でやってみたところ、色が付きました！本当にありがとうございます‼ 質問ばかりで申し訳ないのですが、sanitize.cssは適用されているのでしょうか？ https://csstools.github.io/sanitize.css/ であっています。本に掲載されている画面と私のパソコン上で表示されている画面が異なっていて、混乱しています。2017年の本なのでバージョンの違いのせいなのでしょうか？教えていただけると嬉しいです。よろしくお願いします。

magarugi

2023/03/11 09:48

■参考リセットCSS https://www.jungleocean.com/programming/190417reset-normalize-sanitize-css こちらの1種の様です。ブラウザ別にCSSの効果に差がある事があり、それをなくす目的で充てるCSSで最初のうちは基本的には気にしなくて良いかと、勉強の目的がデザイナー志望でない限りあまりきにする必要はないと思います。ちなみに、先程のリンク先下の方にgithubのリンクがあります。そこによると2021年にも更新があったりするので、ご認識の通りだと思います。

行動規範の内容に同意します