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

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

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

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

Q&A

解決済

2回答

1437閲覧

ATomエディタで入力した文字がwebブラウザにそのまま表示されます

退会済みユーザー

退会済みユーザー

総合スコア0

HTML

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

0グッド

0クリップ

投稿2018/09/30 15:45

編集2018/10/01 00:34

https://dotinstall.com/lessons/basic_html_v4/45103
↑この動画レッスンをそのまま真似したのですが、上手く行きません。

例えば、Atomエディタに 

<h1>はじめまして</h1> <p>こんにちは</p>

と入力したとします。
それをコマンドSで保存します。※保存ファイル「index.html」

保存したファイルをwebブラウザで見るとそのまま

<h1>はじめまして</h1>![イメージ説明](f5efdba23a1299f2b9972cf28761a383.png) <p>こんにちは</p>

↑こんな感じで表示されます。改行もされています。
どうしてでしょうか?よろしくお願いします。

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

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

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

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

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

dice142

2018/09/30 16:12

`</hi>`は誤字ですか?
退会済みユーザー

退会済みユーザー

2018/09/30 22:27

エディタに入力したコードをそのままコピペしてください。
m.ts10806

2018/09/30 23:09

「Webブラウザで見る」だけだと質問者さんがやっている確認手順が確実には伝わりません。具体的に記載してください。
m.ts10806

2018/10/01 00:01

「ブラウザで見たとき」のスクリーンショットなども提示可能でしたらお願いします。
m.ts10806

2018/10/01 00:45

カメラ写真では正しく読み取れないのでPCの「プリントスクリーン」の機能を利用していただけたらと。なんとかたまたま読み取れた部分が原因だったので回答に追記はしましたが。
guest

回答2

0

ベストアンサー

提示htmlである下記を

html

1<h1>はじめまして</h1> 2<p>こんにちは</p>

とりあえず適当なテキストエディタ(私の場合はBrackets)で
これだけ書いて保存し、ブラウザにファイルをドラッグ&ドロップした場合には下記のようになります。
(DOCTYPE宣言もhtmlタグもbodyタグもないです)

FireFoxによる表示
※FireFoxによる表示

GoogleChromeでも同じ結果です。
つまり「再現しない」状況です。

スクリーンショットの提示があればまだ分かるのかなと思いますが、
下記が考えられます。

  1. ファイルダブルクリックでブラウザ開いたつもりだったがデフォルトではテキストエディタが指定されていてテキストエディタで開いただけの状態だった
  2. <や> あとh1などの指定がどこか全角など打ち間違いがあったりh 1 のようにスペースを入れてはいけないところにスペースが入っていた
  3. ファイル名が .htmlではない( index.html.txt とかだとtxtになります).が全角でもダメなはずです。

ご確認ください。

-- 追記

htlmになってます。
htmlです。

最初のうちは声に出して読んでも良いと思います。
正しくは えいち てぃー えむ える です。
「HyperText Markup Language」の頭文字。「言語」なので「l」が最後に来ます。

投稿2018/10/01 00:15

編集2018/10/01 00:43
m.ts10806

総合スコア80765

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

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

退会済みユーザー

退会済みユーザー

2018/10/01 00:58

丁寧に教えて下さってありがとうございます。5日間、同じところでつまずいて悩んでいました。
m.ts10806

2018/10/01 01:03 編集

プログラムは指示したとおりにしか動かないので拡張子も含めて全て1字1句意味を与えるように組む必要があります。 5日間は非常に長いですね・・・。コードに間違いがない場合は「環境」にあることがほとんどです。 Atom使ったことはないですが、調べた感じ構文チェックをしてくれるプラグインがあるようなので https://qiita.com/sy_125/items/521b9492f35e2f1a49ff こういったものを入れてみて「確実に合っているもの」を保証していって問題の切り分けとして利用すると良いです。 もしコード自体が問題なければ疑うのは環境まわりです。htmlとはいえ環境まわりが整備されていないと正しく動きませんので。 解決したようで何よりです。
guest

0

html,head,body各種タグが抜けているという事はありませんよね?そのまま<h1>からはいったとか。。

投稿2018/09/30 23:32

hectopascal1013

総合スコア466

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

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

m.ts10806

2018/10/01 00:03

確認されてみるとわかると思いますが、html宣言もheadもbodyもなくても.html拡張子であれば問題なくタグは解釈されます。
hectopascal1013

2018/10/01 00:26

不足タグは補填されるようですね? 失礼しました。 あと考えられるのは、.htmの拡張子が抜けてそのままテキスト要素だけ保存してるとか???
退会済みユーザー

退会済みユーザー

2018/10/01 01:02

htmlがhtlmになっていました。ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問