atomは1.28.1でHTML5だと思います。
プログラミング学習サイトで勉強しています。
これまでにやったこと
以前作ったのhtmlを今作業しているページにコピペしました。→改行しました
大文字、小文字の確認をしました。→ミスはなかったと思います。
atom、Chromeをそれぞれ終了させました。→改善されず。
atom内
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/07/13 12:19
退会済みユーザー
2018/07/13 12:21
2018/07/13 12:22
回答2件
0
ベストアンサー
1つ前提ですが、「連続する半角文字列」は1単語として解釈されます。
「サイト内の動画」にあるソースは画像を見た感じ、それぞれのHello! の間に半角スペースが入っていますよね。
そのため、1単語が短く解釈されて端っこで改行されています。
(正確には行はかわっていなくて**「折り返し」**です)
実際の英文では「-」で「折り返しても同じ単語だよ」と表現しますが、
html上はそういう単語とかどうとかいう概念はタグやscriptコード以外にはないので、
「単なる文字列の連続」→「1単語」として解釈されます。
例えばこんな感じ
※適当に打ってるので画面表示上ちょっと変わってます。
html
1<body style="width:100px;"> 2<p>qwerty1234567890^\!"#$%&'()=~|asdfghjkl;:]zxcvbnm,./`+><?_*}{</p> 3</body>
概念的には1単語なので何もしなければ勝手に折り返しません。
CSSなどで指定する方法はあります。
それも「よろしく折り返す」か「指定した幅で折り返す」かで指定の仕方も違ってきますので、
その辺りは調べてみてください。
追記(というか蛇足)
蛇足なので参考まで。
ちなみに、検証がてら色々と試してみましたが、半角ハイフン[-]を入れると、英数字をつなぐ箇所に限り、
英単語の折り返し連結と同じくそこで折り返します。(ある程度法則はあり)
最初のほうに入れる
html
1<body style="width:100px;"> 2<p>q-werty1234567890^\!"#$%&'()=~|asdfghjkl;:]zxcvbnm,./`+><?_*}{</p> 3</body>
英数字がある記号の前
html
1<body style="width:100px;"> 2<p>qwerty1234567890-^\!"#$%&'()=~|asdfghjkl;:]zxcvbnm,./`+><?_*}{</p> 3</body>
記号の中
html
1<body style="width:100px;"> 2<p>qwerty1234567890^\!"#-$%&'()=~|asdfghjkl;:]zxcvbnm,./`+><?_*}{</p> 3</body>
途中の英数字の中
html
1<body style="width:100px;"> 2<p>qwerty1234567890^\!"#$%&'()=~|asdfg-hjkl;:]zxcvbnm,./`+><?_*}{</p> 3</body>
複数入れる
html
1<body style="width:100px;"> 2<p>qwe-rty123-4567890^\!"#$%&'()=~|asdfg-hjkl;:]zxc-vbnm,./`+><?_*}{</p> 3</body>
いずれにしても「これ全部で1単語」の意味となり、bodyに指定したwidthは無視されますね。
投稿2018/07/13 11:53
編集2018/07/13 12:28総合スコア80765
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/07/13 12:22
2018/07/13 12:25
退会済みユーザー
2018/07/13 12:36
0
mtsさんの回答をベストアンサーにしたつもりが、下の自己解決方法がベストアンサーになっているようです。
同じ問題でお困りの方はmtsさんの回答をご覧下さい。
mtsさんのおっしゃる通り、連続した文字列だと単語と解釈されて、画面を拡張させて収めてしまいます。CSSからwidthの設定などをして防げることらしいですが、コンピュータに「一単語だよ」と理解してもらう為に半角スペースを開けることを意識するとイイです!
投稿2018/07/13 12:27
編集2018/07/14 03:10退会済みユーザー
総合スコア0
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/07/13 12:35 編集
退会済みユーザー
2018/07/14 03:19
2018/07/14 04:07
退会済みユーザー
2018/07/14 04:12
2018/07/14 04:17
退会済みユーザー
2018/07/14 04:20
あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。