ホームページ > ウェブフロントエンド > htmlチュートリアル > HTMLにスペースを挿入する方法

HTMLにスペースを挿入する方法

青灯夜游
リリース: 2018-12-26 13:20:00
オリジナル
30099 人が閲覧しました

フロントエンド開発では、ページにスペースを追加する必要がある場合がありますが、どのように追加すればよいでしょうか?この記事ではHTMLページにスペースを挿入する方法を紹介しますので、ご参考になれば幸いです。 [関連ビデオ チュートリアルの推奨事項: HTML チュートリアル ]

HTMLにスペースを挿入する方法

1. HTML ページにスペース

を入力します。 「スペース」キーを入力するとスペースを挿入できます。

例: p.p1 に 1 つのスペースを入力し、p.p2 に 5 つのスペースを入力します。注:このとき「スペース」は半角で入力してください。

<p class="p1">测试文字| php中文网!</p>
<p class="p2">测试文字|     php中文网!</p>
ログイン後にコピー

効果画像:

HTMLにスペースを挿入する方法

1を入力しても「スペース」と入力しても表示されます。 HTML 内のスペース、または 5 つのスペース、またはその他の複数のスペースがある場合、Web ブラウザーはこれらのスペースを 1 つのスペースに自動的に折りたたみます。

では、複数の入力されたスペースを表示するにはどうすればよいでしょうか?全角の状態で「スペース」キーを入力できます。例:

<p class="p1">测试文字| php中文网!</p>
<p class="p2">测试文字|      php中文网!</p>
ログイン後にコピー

効果画像:

HTMLにスペースを挿入する方法

注: 全角スペースは漢字として解釈され、空白は漢字の形で表示され、実数で表示されます(数ある限り表示されます)。

または、

 タグを使用してこの問題を解決します (「スペース」を半角で入力します)。例: </p><pre class="brush:html;toolbar:false"><p class="p1">
    <pre class="brush:php;toolbar:false">测试文字| php中文网!
ログイン後にコピー

测试文字|     php中文网!
ログイン後にコピー

レンダリング:

HTMLにスペースを挿入する方法

2. html のスペース文字を使用する

HTML でスペースを表す文字エンティティを使用して、HTML ページにスペースを挿入できます。スペースを表す文字エンティティを見てみましょう。 HTML 内:

文字: 連続した空白スペース。このスペースの幅はフォントの影響を受けます。

 文字: 全角モードで「スペース」キーの半分 (漢字の半分の幅) を入力します。

 文字: 全角モード (漢字 1 文字の幅) で「スペース」キーを入力します。

効果を見てみましょう:

<p class="p1">测试文字|  字符nbsp显示空格!</p><br /
<p class="p2">测试文字|&ensp;字符ensp显示空格!</p><br />
<p class="p3">测试文字|&emsp;字符emnsp显示空格!</p>
ログイン後にコピー
レンダリング:


HTMLにスペースを挿入する方法# 説明:   と  占有幅は基本的にフォントの影響を受けず、非常に堅牢です。

要約: 以上がこの記事の全内容です。皆さんの学習に役立つことを願っています。

以上がHTMLにスペースを挿入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート