質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

解決済

4回答

1685閲覧

ATOMというテキストエディタを使いたい

退会済みユーザー

退会済みユーザー

総合スコア0

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2019/08/16 04:27

###問題点
ATOMというテキストエディタでHTML5やCSSなどをやろうと思ってインストールして早速、ちゃんとできるかとても簡易的なコードを書きました。そしてそのコードが

Html

1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <title>title</title> 6 </head> 7 <style media="screen"> 8 body{ 9 color=:red; 10 } 11 </style> 12 <body> 13a 14 </body> 15</html> 16

なんですが、まずbodyのaが赤色になりませんでした。
さらに、atomはタグとかを書くと分かりやすいように自動でそのコードに色づけされるのですが、このコード中の、styleの中にあるbodyは白色の文字のままで、もしかしたら色づけされない=反応してないのかなと思います。(aが赤くならないのも説明できますから)

###どうすればちゃんとATOMがタグやcolorとかのCSSに反応してくれるのでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

gentaro

2019/08/16 04:31

質問ガイドラインがあるんで読んでください。 https://teratail.com/help/question-tips 「ATOM 使い方」とかでググると素敵な解説サイトがいっぱい出てきますんで、読めばたぶんわかると思います。
m.ts10806

2019/08/16 04:33 編集

タイトルと内容があっていません。 タイトルは「CSSで指定した文字色が反映されない」で良いと思います。
gentaro

2019/08/16 04:34

あ、はやとちりしてました。そこの問題じゃなかったんですね。
moredeep

2019/08/16 05:34

aが赤色云々は、ATOMのエディタ上での色付けの話ですか?だとしたら当たり前だと思うのですが。 bodyが白いのは確かにおかしいと思います。 画像を張って、どうなっているのかを示した方がいいんじゃないかなと。
guest

回答4

0

ATOM関係なくCSSの文法の問題です。

CSSの基本形は

css

1 2指定したいセレクタ(タグやID、クラスなど){ 3 指定:指定内容; 4}

です。

今回のように=は不要です。

CSSの基本書式

投稿2019/08/16 04:30

m.ts10806

総合スコア80765

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

ベストアンサー

色々確認したい点がありますが、とりあえず言えるのは「color=:red;」の「=」は不要です。
下記のようにする事で赤字になります。

color:red;

投稿2019/08/16 04:30

yamap55

総合スコア1376

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

HTML

1<style media="screen"> 2 body{ 3 color=:red; ← 余計な = 入ってますけど・・・? 4 } 5 </style>

投稿2019/08/16 04:29

azuapricot

総合スコア2341

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

styleはheadの中に入れないとダメでしょう。

投稿2019/08/16 04:29

KojiDoi

総合スコア13669

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/08/16 04:32 編集

入れる場所はほぼ関係ないですよ。 極端な例、<html>タグより外に出しても動きます。 </html> <style> body{ color:red; } </style>
m.ts10806

2019/08/16 04:48 編集

そうですね。もちろん役割からするとhead内にいれるべきですが、「動かすだけ」ならどこでも良いということになります。 (さすがにhtml外に置いても動くのは今回初めて確認しました)
moredeep

2019/08/16 05:36

styleはメタデータコンテンツで、メタデータコンテンツを受け入れるのってheadだけじゃなかったですか?だとしたらダメと言い切ってもいいと思うんですけど。
m.ts10806

2019/08/16 05:41 編集

メタデータコンテンツはあくまで「head要素内で”使用できる要素”」というイメージですね。 コメントで補足しているように「動くからってどこにでも入れちゃえ」とするのはNGですが 「入れないとダメ」としてしまうと「<head>内に入ってないから動かないんだよ」と本来の原因(=文法)と違うところを指摘していることになるので、ここで言及するのは間違いと思っています。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問