PDF形式でダウンロード PDF形式でダウンロード

この記事では、HTMLで半角スペースと改行を挿入する方法を紹介します。半角でスペースキーを何度押してもHTMLでは半角スペースが1つしか表示されないので、一度に複数の半角スペースを挿入したいときは、HTMLタグを使用しましょう。

方法 1
方法 1 の 3:
HTMLを使用する

  1. 1
    HTMLファイルを開く HTMLファイルを編集するには、メモ帳(Windows)やテキストエディット(Mac)などのテキストエディタを使用します。Adobe DreamweaverなどのHTMLエディタを使用することも可能です。HTMLファイルを開くには、以下の操作を行います。
    • Windowsの場合はエクスプローラー、Macの場合はFinderでHTMLファイルが保存されているフォルダを開きます。
    • 編集したいHTMLファイルを右クリックします。
    • プログラムから開く(Windows)またはこのアプリケーションで開く(Mac)にカーソルを合わせます。
    • HTMLファイルを編集したいプログラム(アプリケーション)をクリックします。
  2. 2
    spaceキーを押して、通常の半角スペースを挿入する 通常の半角スペースを挿入するには、半角スペースを挿入したい場所をクリックし、半角でスペースキーを押します。通常、HTMLでは半角でスペースキーを何度押しても、文字と文字の間には半角スペースは1つしか表示されません。
  3. 3
     と入力して、もう1つ半角スペースを強制的に挿入する これは、その場所での改行を防ぐことから「ノーブレークスペース(非分割空白)」と呼ばれます。[1]
    • 例えば、Hello   there!(こんにちは!)と入力すると、「Hello」と「there!」の間にもう1つ半角スペースが挿入されます。
    • この文字コードを使用すぎると、ブラウザできちんと読みやすい形で改行が挿入されなくなります。[2]
    • また、 と入力して半角スペースを強制的に挿入することも可能です。
  4. 4
    半角スペースを多く挿入する 連続した半角スペースをより多く挿入するには、以下のいずれかの文字コードを使用します。[3]
    • 2タブ(半角スペース2つ分) と入力します。
    • 4タブ(半角スペース3つ分) と入力します。
    • インデント(字下げ)    と入力します。
    広告

方法 2
方法 2 の 3:
CSSを使用する

  1. 1
    HTMLまたはCSSファイルを開く CSSはHTMLファイルのヘッダーに適用することも、外部CSSファイルとして記述することもできます。
    • HTMLファイルのヘッダーは、ファイル先頭の<head>タグと</head>タグの間に記述されています。
  2. 2
    CSSスタイルシートを作成する スタイルシートはHTMLファイルのヘッダー、または外部CSSファイルに作成します。以下のタグを使用してHTMLまたはCSSファイルにスタイルシートを作成しましょう。
    • スタイルシートの記述を開始するときは、<style>と入力しましょう。CSSコードはすべてこの開始タグの後に記述します。
    • スタイルシートの記述を終了するときは、</style>と入力しましょう。CSSコードはすべてこの終了タグの前に記述します。
  3. 3
    インデント(字下げ)幅を指定するコードをスタイルシートに入力する p {text-indent: 5em;}というコードをスタイルシートに入力しましょう。HTMLコードが正しければ、半角スペース5つ分のインデントスが挿入されます。
    • 「text-indent:」の後に別の数字を入力すれば、半角スペースの連続する幅を調整することができます。
    • 「em」という単位は、指定したフォントサイズでの半角スペース1つ分に相当します。パーセンテージ(例:「text-indent: 15%;」)や長さ(例:「text-indent: 3mm;」)など、他の単位を使用することも可能です。
  4. 4
    インデントを挿入したい場所に<p>と入力する HTMLファイルの本文でテキストをインデント(字下げ)したい場所に入力すると、スタイルシートで指定したフォントサイズに合わせてインデントがテキストに挿入されます。
    広告

方法 3
方法 3 の 3:
整形済みテキストを使用する

  1. 1
    HTMLファイルを開く HTMLファイルを編集するには、メモ帳(Windows)やテキストエディット(Mac)などのテキストエディタを使用します。また、Adobe DreamweaverなどのHTMLエディタを使用することも可能です。HTMLファイルを開くには、以下の操作を行います。
    • Windowsの場合はエクスプローラー、Macの場合はFinderでHTMLファイルが保存されているフォルダを開きます。
    • 編集したいHTMLファイルを右クリックします。
    • プログラムから開く(Windows)またはこのアプリケーションで開く(Mac)にカーソルを合わせます。
    • HTMLファイルを編集したいプログラム(アプリケーション)をクリックします。
  2. 2
    整形済みテキストにしたいテキストの前に<pre>と入力する これが整形済みテキストの開始タグです。
  3. 3
    <pre>タグの後に正確にテキストを入力する テキストを整形済みテキストにすることで、Enterキーを押したときに挿入される半角スペースや改行がHTMLページに表示されるようになります。[4]
  4. 4
    テキストの後に</pre>と入力する これで整形済みテキストの記述が終了します。
    広告

ポイント

  • ブラウザで半角スペースが変な記号になってしまう場合は、おそらくブラウザでの表示を想定していないワープロソフトで保存された余分なデータが原因です。このような場合は、メモ帳やテキストエディットなどのテキストエディタを使用しましょう。
  • CSSを使用すれば、テキストの文字間隔を含むページのレイアウトをより確実に行うことができます。
  • ノーブレークスペース(非分割空白)「&nbsp;」は文字実体参照の一例で、キーボードで入力できない文字を参照するコードです。
広告

注意事項

  • 一般的なワープロソフトで使うタブキーの働きは通常のHTMLでは無効なので、Tab キーを押すと入力されるタブコード(&#09;)を入力しても何も表示されません。
  • HTMLはワープロソフトではなく、必ずコードエディタやテキストエディタで記述しましょう。
広告

関連記事

USBメモリーに音楽を入れるUSBメモリーに音楽を入れる
Spotifyの再生時間を確認するSpotifyの再生時間を確認する
Windows PCでコマンドプロンプトからexeを実行するWindows PCでコマンドプロンプトからexeを実行する
HPでスクリーンショットを撮るHPでスクリーンショットを撮る
充電器なしでノートパソコンのバッテリーを充電する充電器を忘れたときに代用してノートパソコンを充電する方法4選
マウスの代わりにキーボードでクリックするマウスの代わりにキーボードでクリックする
Webページの画面をコピーするWebページの画面をコピーする
ゼロになったノートパソコンのバッテリーを復活させるゼロになったノートパソコンのバッテリーを復活させる
2台のモニターを設定する2台のモニターを設定する
iPhoneでApple IDの主電話番号を変更するiPhoneでApple IDの主電話番号を変更する
パソコン上で開いているすべてのウィンドウを一覧するパソコン上で開いているすべてのウィンドウを一覧する
7 Zipでファイルを高圧縮する7 Zipでファイルを高圧縮する
2台のパソコンを接続する2台のパソコンを接続する
ノートパソコンに貼ったシールを剥がす
広告

このwikiHow記事について

wikiHow編集チーム
共著者 ::
wikiHowスタッフライター
この記事は、経験豊富なwikiHowの編集者と調査員から成るチームによって執筆されています。調査員チームは内容の正確性と網羅性を確認しています。

wikiHowのコンテンツ管理チームは、編集チームが編集した記事を細心の注意を払って精査し、すべての記事がwikiHowの高品質基準を満たしているかどうかを確認しています。 この記事は9,032回アクセスされました。
カテゴリ: コンピューター
このページは 9,032 回アクセスされました。

この記事は役に立ちましたか?

広告