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

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

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

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

2219閲覧

Atom linter css エラー表示について

soma-3

総合スコア9

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/03/23 03:35

編集2020/03/25 05:24

イメージ説明

Atomにて上記のエラーが出るんですが、なにが問題なのか
分かる方いらっしゃいますか?

自分で調べてみたのですがよく理解できてません;

css

1charset "UTF-8"; 2/*ユニバーサルセレクタで余白リセット*/ 3*{ 4 margin: 0; 5 padding:0; 6} 7body{ 8 font-family:serif; 9} 10 11.container{ 12 max-width: 1000px; 13 margin: auto; 14} 15 16.flex{ /*flex-box用のクラス指定*/ 17 display: flex; 18} 19 20/*動画内ではfloatだが、ここではflex-boxを使用してみる。*/ 21#site_logo{ 22 23 width: 65%; 24} 25#site_reserve{ 26 27 width:35%; 28 text-align: right; 29 margin-top: 10px; 30} 31 32.site_tel{ 33 font-size: 1.5rem; 34 color:#c20D23; 35} 36nav{ 37 background: #c20d23; 38} 39nav ul{ 40 list-style: none; 41 display: flex; 42} 43nav li{ 44 text-decoration: none; 45 padding:30px; 46}

html

1<!DOCTYPE html> 2<html> 3<lang="ja"> 4 5 <head> 6 <meta charset="utf-8"> 7 <title>#</title> 8 <link rel="stylesheet" href="css/style.css"> 9 <link href="https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap" rel="stylesheet"><!--グーグルフォントはhead内に書き込む--> 10 </head> 11 12 <body> 13 14 <header> 15 <div class="container"><!--左右の余白用のボックス--> 16 <div class="flex"> 17 <div id="site_logo"> 18 <h1><img src="images/logo.png" alt="Logo"></h1> 19 </div> 20 <div id="site_reserve"> 21 <p>ご予約はこちらから</p> 22 <p class="site_tel">TEL:000-000-0000</p> 23 </div> 24 </div> 25 </div> 26 <nav> 27 <div class="container"><!--左右の余白用のボックス--> 28 <ul> 29 <li><a href="#">トップ</a</li> 30 <li><a href="#concept">コンセプト</a></li> 31 <li><a href="#menu">メニュー</a></li> 32 <li><a href="#access">アクセス</a></li> 33 </ul> 34 </div> 35 </nav> 36 </header> 37 38 <main> 39 <!--メインイメージエリア--> 40 <section id="concept"> 41 <img src="images/top_image.png" alt="メインイメージ画像"> 42 </section> 43 <!--コンセプトエリア--> 44 <section id="concept"> 45 <div class="container"> <!--左右の余白用のボックス--> 46 <img id="concept_logo"src="images/concept_image.png" alt="コンセプトイメージ画像"><!--あとでCSSで個別にサイズ調整するためにIDタグで紐付け--> 47 <h2>コンセプト</h2> 48 <img src="images/concept_image2.png" alt="concept_image2" id="concept_icon"> 49 50 <p>本場イタリアで大人気の本格イタリア料理店がついに日本上陸</br> 51 当店自慢のテラスで極上のイタリア料理とお酒をお楽しみください。</p> 52 </div> 53 </section> 54 <!--メニューエリア--> 55 <section id="menu"> 56 <div class="container"> <!--左右の余白用のボックス--> 57 <img src="images/menu_image.png" alt="menu_image" id="menu_logo"> 58 <h2>メニュー</h2> 59 <div class="menu_box"> 60 <img src="images/menu_pasta.jpg" alt="メニュー画像1"> 61 <h3>パスタ</h3> 62 <ul> 63 <li>海鮮トマトソースパスタ</li> 64 <li>本格イタリアンミートソース</li> 65 </ul> 66 </div> 67 68 <div class="menu_box"> 69 <img src="images/menu_piza.jpg" alt="メニュー画像2"> 70 <h3>パスタ</h3> 71 <ul> 72 <li>海鮮トマトソースパスタ</li> 73 <li>本格イタリアンミートソース</li> 74 </ul> 75 </div> 76 77 <div class="menu_box"> 78 <img src="images/menu_drink.jpg" alt="メニュー画像3"> 79 <h3>パスタ</h3> 80 <ul> 81 <li>海鮮トマトソースパスタ</li> 82 <li>本格イタリアンミートソース</li> 83 </ul> 84 </div> 85 </div> 86 87 </section> 88 <!--アクセスエリア--> 89 <section id="acces"> 90 <div class="container"> <!--左右の余白用のボックス--> 91 <h2>アクセス</h2> 92 <div id="access_map"> 93 <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d723.710085522283!2d130.7972110782677!3d33.8470037925491!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sja!2sjp!4v1584862316015!5m2!1sja!2sjp" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe> 94 </div> 95 <div id="access_text"> 96 <p>〒000−0000 なんとか県なんとか市なんとかなんとか</p> 97 <p>TEL 000−0000</p> 98 <p>営業時間 11時〜15時 17時〜22時</p> 99 <p>定休日:火曜日</p> 100 </div> 101 <div id="accsess_reserve"> 102 <p>ご予約はこちらから</p> 103 <p>TEL:000−0000</p> 104 </div> 105 </section> 106 </main> 107 108 109 110 111 112 113 <footer> 114 <p>Copyright©somacreate.com</p> 115 </footer> 116 117</body> 118 119</html>

Homebrewをインストールしてみましたが、エラー表示が出たままです。

Homebrewをインストールしただけではnodeがインストールされているわけではないのでしょうか?

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

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

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

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

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

m.ts10806

2020/03/23 04:30

調べてみたことを記載してください。 「調べた」だけだと他者には何も調べてないのと同じです。
hoshi-takanori

2020/03/23 04:43

env: node: No such file or directory というのは、node がインストールされてないのだと思われます。
soma-3

2020/03/23 04:53

ご指摘ありがとうございます。 調べた内容は[env: node: No such file or directory]でぐぐって上から5つのサイトを読んでみました。 そもそもなんの事なのか分からない単語があり(fish-nvm,npm,node,file watcher,nodebrew...)そもそもそこに書いてあることが 自分が知りたい情報なのかの判断ができません。 nodeがインストールされていない事によるエラー表示なんですね。 各単語についても検索してみますが、その場の対処としてエラー表示を消す手段はわかりますでしょうか?
hoshi-takanori

2020/03/23 04:55

node という JavaScript を実行するためのプログラムが入ってないのだと思われます。 インストール方法は、個人的には Homebrew というものがお勧めですが、ご存知ですか?
m.ts10806

2020/03/23 04:58

質問は編集できるので適宜追記願います
hoshi-takanori

2020/03/25 07:53

Homebrew(brew と略すことが多いです)自体は node ではなく、node を含め、コマンドラインで使えるさまざまなツールをインストールするためのもので、特に開発用のツールが充実しています。 Homebrew で node をインストールするには以下のコマンドを実行します。 brew install node その他、Homebrew の使い方は以下の記事などを参考にしてください。 https://qiita.com/fuqda/items/db8aff0ba4068aea2cc6
guest

回答1

0

自己解決

Atomでlinterというcssのエラーを表示してくれるパッケージをインストールしたところ
画像のようなエラーが出た。

↓nodeがインストールされていないことが原因

↓brew(Homebrew)をインストール

↓brewのnodeをインストールする

これでエラー表示がなくなった。
============================
アドバイスをくれた方々、ありがとうございました。
brewの使い方など勉強します。

投稿2020/03/25 08:03

soma-3

総合スコア9

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問