Q&A
html ソースはどうなっているのですか？ 改行すると <br /> が入る設定になっていませんか？
前提・実現したいこと
VScodeでWEBサイトを制作している時にエディタ内で文字を改行すると
反映画面でも改行されてしまうので改行されないようにしたい
発生している問題・エラーメッセージ
▼エディタ
<p>これは テスト です </p>▼反映画面
これは
テスト
です
改善後のイメージ
▼エディタ
<p>これは テスト です </p>▼反映画面
これはテストです
初心者での質問で勝手もわからず大変恐縮ですが
どなたかご存知でしたらご教示願います。
ご回答ありがとうございます！
ご返信遅くなり申し訳ございません。
そういった設定があるのですね。。
探してみたもののそれ事態がよくわからず。。
引き続きそちらの設定方法調べてみます。
> そういった設定があるのですね。。
VS Code は触ったこともないのでそういう設定とか拡張機能などがあるかどうかは自分は分かりません。なので「html ソースはどうなっているのですか？」と書きました。見ましたか？
回答の仕方が正しいかわかりませんが、ソース上では<br />にはなっていません。
「反映画面」というのは、「エディタ」で作った html ソースを、ブラウザ上で表示した結果と思っていたのですが、違うのですか？ 違うのであれな何なのでしょう？
「反映画面」というのは、「エディタ」で作った html ソースを、ブラウザ上で表示した結果ということであっています。
であれば、html ソースに <br /> がないと改行されないはずですが？？？
文章だけでは話が通じないかもしれないので、「html ソースに <br /> がないと改行されないはず」というのがどういうことか回答欄に画像を貼っておきます。
であれば、html ソースに <br /> がないと改行されないはずですが？？？
>ですので不思議に思い、ご質問させていただいているのですが？？？
画像など使用して詳しくご教示いただき誠にありがとうございます。
おっしゃっていることは認識しております。
バイナリのことについては詳しくありませんが。
html ソースが「<p>これは<br />テスト<br />です</p>」となっているとしか考えられないです。
＞承知しました。ご回答ありがとうございました。
回答に対するコメントは回答のコメント欄に書くようお願いします。
htmlはほとんど触れたことないのですが，cssとかいうのでpに関して余計なことを書くとそんなことになったような…？
回答2件
0
（もう質問者がいなくなってるし，内容としても全然関係ないかもしれないけれど）
「質問への追記・修正、ベストアンサー選択の依頼」欄に書いた
cssとかいうのでpに関して余計なことを書くとそんなことになったような…？
という微かな記憶について，気になったのでググったら
p { white-space: pre; }
というのが見つかった．
（実際に自身が過去に遭遇したのがこれだったのかは定かではないが…）
html見ても<br>が存在しない場合，
こんなものがどこかに存在している可能性もあるのかも？？
投稿2020/12/15 04:18
総合スコア11985
その可能性はありますね。もしくは <p> ... </p> ではなくて <pre> ... </pre> とか。
0
文章だけでは話が通じないかもしれないので、質問のコメントに書いた「html ソースに <br /> がないと改行されないはず」というのがどういうことか画像を貼って説明します。
VS Code は触ったこともないのですが、VS Code は Visual Studio のエディタ機能を抜き出したものということなので、Visual Syudio Community 2019 で html を書いたのが以下の画面です。
Visual Syudio Community 2019 のデフォルト設定では、エディタで Enter キーを押して改行しても自動的に <br /> が入るということはありません（上側のように）。ブラウザの表示で改行したい場合は自分で <br /> とタイプする必要があります（下側のように）。
これをブラウザに表示すると以下のようになります。
上の画像の html ソースを表示すると以下のようになります。Visual Studio のエディタの表示と同じです。<br /> がブラウザ上では改行になっているのが分かりますか？（逆に言えば <br /> がないとブラウザでは改行されません）
下の画像は html ソースをバイナリエディタで見たものです。エディタで Enter キーを押してエディタ上で改行した場合は改行コード 0D 0A (16 進数) となっているのが分かりますか？ <br /> は 3C 62 72 20 2F 3E (16 進数) になっています。
というわけで、質問の「発生している問題・エラーメッセージ」のようになるのは、html ソースが「<p>これは<br />テスト<br />です</p>」となっているとしか考えられないです。
投稿2020/12/14 06:32
退会済みユーザー
総合スコア0
であれば、html ソースに <br /> がないと改行されないはずですが？？？
>ですので不思議に思い、ご質問させていただいているのですが？？？
画像など使用して詳しくご教示いただき誠にありがとうございます。
おっしゃっていることは認識しております。
バイナリのことについては詳しくありませんが。
html ソースが「<p>これは<br />テスト<br />です</p>」となっているとしか考えられないです。
＞承知しました。ご回答ありがとうございました。
> ですので不思議に思い、ご質問させていただいているのですが？？？
問題のエディタの編集結果を Edge または Chrome に表示させた画像と、ブラウザに html ソースを表示させて（ブラウザの画面を右クリックして出てきたメニューの「ページのソース表示」を選択）その画像を質問欄を編集して貼っていただけませんか？
> は相手の文章を引用する場合に使うもので、自分のレスの頭に付けるものではありませんのでご注意を。
それは今回の質問とは関係ないかと思いますが、ご指摘ありがとうございます。
終始威圧的なコメントに初心者は心が折れそうなのでもうコメントは結構です。
ありがとうございました。
ゆとり教育の成果（？）かな？
あなたの回答
tips
プレビュー
