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

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

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

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

HTML

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

Q&A

解決済

1回答

1639閲覧

HTMLのエラーの原因がわかりません

python_

総合スコア19

HTML5

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

HTML

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

0グッド

0クリップ

投稿2020/04/18 04:32

<h3>学べるレッスン</h3> <div class="content HTML&CSS"> <img src="https://s3-ap-northeast-1.amazonaws.com/progate/shared/images/lesson/html/study/html.svg"> <div class="contents-name">HTML&CSS</div> </div> コード

この3行目のdivタグと5行目のdivタグにエラーが表示されているのですが何が問題なのか分からなくて困っています。どなたかエラーの理由を教えていただけませんか?

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

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

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

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

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

python_

2020/04/18 06:17

progateでやっているのですがエラーメッセージは特になく間違っている箇所しか教えてもらえません。これだけでは不十分ですか?
m.ts10806

2020/04/18 06:19

Progateやっているというのが伝わらないので、現在の本文では不十分です。質問本文を加筆修正してください。
python_

2020/04/18 09:40

こちらの説明が不十分で申し訳ありません。無事他の方からのアドバイスにより解決することができました。お時間を割いていただきありがとうございました。説明の仕方今後気をつけます。ありがとうございました。
退会済みユーザー

退会済みユーザー

2020/04/18 09:46

書きっぷりからマルチポストをしてるようだが、その場合ちゃんと情報共有をしましょう ※ 他の方からのアドバイスにより解決したことを自己解決として記載しましょう
m.ts10806

2020/04/18 09:56

そうなんですよね。 どう解決したかわからないし、こっちは「受付中」のままですしね。 それが例え「他のQAサイト」ではなかったとしても、マルチポストですし、マルチポストしてる人でうまく立ち回れる人を見たことがありません。
kei344

2020/04/18 10:30

【#他のサービスにも質問投稿をしたい(してしまった) ヘルプ|teratail(テラテイル)】 https://teratail.com/help#posted-otherservice > teratailでは、マルチポスト※の推奨はしていません。 > やむを得ず複数のサイトに質問を投稿された場合は、質問内容にマルチポストをする理由を書き、他のサイトの投稿へのリンクを貼ってください。また、解決した際には必ずteratail及びすべての投稿に解決した旨と、どのように解決したかを記載してください。
python_

2020/04/18 14:50

すみません。マルチポスト機能をオフにするためにはどのようにしたら良いのですか?初歩的な質問ですみません。
退会済みユーザー

退会済みユーザー

2020/04/18 14:54

つまり じぶんの行動(マルチポスト:複数サイトへの投稿)を制御できないと?
m.ts10806

2020/04/18 21:27

マルチポストは「機能」ではないです。 「複数サイトに同じ投稿をするユーザーの行為」そのものです。 kei344さんが提示してくれているteratailのヘルプにそって「投稿してしまったあとの対応」を適切にしてください。 片方の対応が疎かになるとそのサイトに迷惑をかけることになります。 (先に書いたように自らうまく立ち回れてる人を見たことがありません。指摘されて動く人ばかりです)
python_

2020/04/19 02:54

私はteratail以外にこの質問は投稿していないのですがマルチポストに当たるのですか?
m.ts10806

2020/04/19 03:12

>無事他の方からのアドバイスにより と書かれています。通常なら「他のQAサイトに投稿した」という印象を持ちます。 が、私は04/18 18:56に「他のQAサイトでなかったとしても」と補足をつけた上でマルチとしています。 特徴として「もう別で解決できたからそれで終わり」と自己満足で終わっているところです。 いつまでこの質問を「受付中」にしておくつもりですか? kei344さんが挙げてくれたteratailのヘルプは読みましたか? 下記のように書いてありますね。 >解決した際には必ずteratail及びすべての投稿に解決した旨と、どのように解決したかを記載してください。
python_

2020/04/19 03:19

そういうことだったのですね。大変失礼いたしました。きちんと説明をつけておけばよかったですね。解決済みにしてしまうとマルチポストに関するご意見から逃げてもう回答する気はないというような印象を与えてしまうのではないかなと思ってまだ受付中にしていました。色々とご迷惑をおかけして申し訳ありません。
退会済みユーザー

退会済みユーザー

2020/04/19 03:23

> 無事他の方からのアドバイスにより解決することができました。お時間を割いていただきありがとうございました。 この質問の中での話なら名前を出せばいいです。 名前が挙がってない人だから出せない=マルチポストととれる。 うちはは解決につながるとは思えない。(いくらか記述方法があるしデザインとは関係がない) でそれ以外のやり取りだと本人と思われる人に「他の人」と発言しているからなおさら
退会済みユーザー

退会済みユーザー

2020/04/19 03:23

どっちにしろ解決したならどう解決したか書きましょう
python_

2020/04/19 03:31

2つのスレッドが全く別の人によって書かれたと思い込んでいて同じ方が2つのスレッドに跨いで投稿していただいていたことに気づかずこのような誤解をさせてしまいました。ご迷惑おかけして申し訳ありません。
python_

2020/04/19 03:33

3行目のdivタグに関しては&を使わずに表記すれば正常に作動しました。5行目に関しては&が半角になっていてそれでエラーが起きていたようです。いろいろとご迷惑をおかけして申し訳ありません。無事解決いたしました。
退会済みユーザー

退会済みユーザー

2020/04/19 03:37

検証結果のエラーメッセージを回答者が取り違えてたが 「classで利用できない文字列」と考えても良いかもしれません。 上記がドンピシャだったのね
python_

2020/04/19 03:43

そのようです。もう一つは自分のミスでした。何もわかっておらずたくさんご迷惑をおかけして申し訳ありません。正直、エラーが起きた時に何を試せばいいのか分かっていません。その結果とても分かりにくい説明になってしまい申し訳ありませんでした。少しずつできることを増やしていこうと思いますのでどうかまたご回答いただけるとありがたいです。ありがとうございました。
python_

2020/04/20 05:41

そうです!m.ts10806さんのアドバイスにしたがってclass名から&を削除したところエラーはなくなりました。別のスレッドでしたので全く別の方だと誤認していました。ありがとうございました。今回の件でたくさんのご不便とご迷惑をおかけしてしまい申し訳ありませんでした。無事解決することができました。ありがとうございました。
guest

回答1

0

ベストアンサー

「Progateやってる人しか確かめられない」のはかなり回答の敷居が高くなります。全ての人がProgateを通るわけではありません(私はそもそもオンライン学習使用経験がないです)

そもそもですが、HTMLは実行時にエラーを出力してくれる言語ではないので、結局のところは「想定しているレイアウトができているか」に終始することになるのが実際の現場になると思います。
ただ、「言語」であるため、一定の構文ルールはあります。エラーで教えてくれないだけで、書かれたように馬鹿正直に結果を表示してくれます。

そういうときにいったん気を付けたいのが「構文」です。
ただ、W3Cのような本体の仕様を全て確認するのは大変ですし、
私自身もそこまで深く仕様確認することってあまりありません。
(teratailで回答するために確認したことはありますが)

そういうときには「構文チェック機能」がついているエディタを使うと良いです。
構文チェックサービスもあります。

Another HTML-lint

こちらに通すと今回のHTMLは以下のような結果になりました。
イメージ説明

DOCTYPEはテンプレートのままで入れているので無視するとして、2と4ですね。

「不明な実体参照」という難しげな言葉が書いてありますが、「不明」
要は「classで利用できない文字列」と考えても良いかもしれません。

下記を参考にしてください。

id名/class名に使用できる文字の種類
CSS (Selectors API)

投稿2020/04/18 06:30

m.ts10806

総合スコア80861

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

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

m.ts10806

2020/04/18 07:18

おーそっちでしたか。属性値のほうも検証されるもんなんですね。勉強になった。
退会済みユーザー

退会済みユーザー

2020/04/18 07:29

検証されるのは不具合か割愛したかのどっちかだとおもうw
python_

2020/04/18 09:42

&という文字は存在しないということですか?
退会済みユーザー

退会済みユーザー

2020/04/18 09:47

& は &amp; で記載することが好ましい (ブラウザの誤認識を避けるためにも)
m.ts10806

2020/04/18 09:53

さまざまな特別な意味を持ちますので直接使うのは避けるのが確実です。
python_

2020/04/18 14:48

そうなんですね!ありがとうございます!
python_

2020/04/20 09:00

ご指摘の通りclass名から&を削除したところエラーはなくなりました。ありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.46%

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

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

質問する

関連した質問