HTMLに外部CSSをインプットしているのですが、背景に色を付けられません。間違いがありましたら、ご指摘おねがいします。ちなみに、CSSの他の内容は、しっかり適用されていました。条件………… 背景の色：黒文字の色：白同じディレクトリにあるmysite.cssを使用 HTML ここの内容は適用されています。更新：2019/08/11 CSS @charset "UTF-8" body { background-color:#000 /*背景を黒に設定*/ color:#fff /*文字の色を白にセット*/ } h1.center { text-align:center /*文字中心（ここは適用された。）*/ }

HTMLの背景に色が付きません。

解決済

質問者：asatonkamera
質問日時：2019/08/11 20:40
回答数：4件

HTMLに外部CSSをインプットしているのですが、背景に色を付けられません。間違いがありましたら、ご指摘おねがいします。ちなみに、CSSの他の内容は、しっかり適用されていました。
条件…………
背景の色：黒　　文字の色：白
同じディレクトリにあるmysite.cssを使用

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="mysite.css">
<title></title>
</head>

<body>
<h1 class="center">ここの内容は適用されています。</h1>
<p><hr>
<p><h2></h2>
<div class="center">更新：2019/08/11</div>

<p>
<a href=""></a><br>
</p>

</body>
</html>

CSS

@charset "UTF-8"
body {
background-color:#000 /*背景を黒に設定*/
color:#fff /*文字の色を白にセット*/
}
h1.center {
text-align:center /*文字中心（ここは適用された。）*/
}

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： t_fumiaki
回答日時：2019/08/11 21:37

} までをcharsetのプロパティだと認識しているから。

@charset "UTF-8"　⇒　@charset "UTF-8";

最後に;をつけるのを習慣にして下さい。
全てに;が無い。

- 0
- 件

通報する

この回答へのお礼

すっかり;をつけるのをわすれていました。次から;の付け忘れには気を付けます。アドバイスありがとうございました。

通報する

お礼日時：2019/08/12 08:27

No.4

回答者： wellow
回答日時：2019/08/11 23:51

セミコロンは多くの人が言及されているので、

＞background-color:#000 /*背景を黒に設定*/
＞color:#fff /*文字の色を白にセット*/

#000000、#ffffffじゃね？　省略するなら、省略されたときのデフォルト値を完璧に理解していないと何を言っても戯言。

- 0
- 件

通報する

この回答へのお礼

アドバイスありがとうございます。;をつけたところ、#000や#fffのままでもしっかり動いたので、一応このままにしておきたいと思います。

通報する

お礼日時：2019/08/12 08:26

No.2

回答者： stcp
回答日時：2019/08/11 21:19

@charset "UTF-8"

の行末にセミコロンを付けていないのも原因の一つです。

- 0
- 件

通報する

この回答へのお礼

fine_dayさんのアドバイスも併せてやってみたところ、しっかり背景と文字の色を変えることができました。ありがとうございました。

通報する

お礼日時：2019/08/12 08:21

No.1

回答者： fine_day
回答日時：2019/08/11 20:55

背景色とフォント色の２つを指定しているので、あいだをセミコロン（;）で区切らないといけないのでは…？

body {
background-color:#000;
color:#fff
}

- 1
- 件

通報する

この回答へのお礼

今、先ほど同じことに気が付き、試したのですが、変わりませんでした。
また、HTMLのなかに、
<head>
.
.　中略
.
<style>
body{
background-color:#000;
color:#fff;
}
</style>
</head>
と入力ところ、しっかり適用されました。

通報する

お礼日時：2019/08/11 21:02

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！