HTMLで空白を使用する方法

white-space は HTML のタグです。そこで今日は、この 属性の使用方法と、どのような状況で使用できるかについて、一般的な科学をいくつか紹介します

white-space norma nowrap は、すべてのテキストを強制的にすべてのテキスト コンテンツが改行なしで 1 行に表示されるように、同じ行に表示されます。

CSS の幅がどれだけ設定されていても、テキストが自動的に折り返されないようにします。すべてのテキストは 1 行で表示されます。特にタイトルリストの場合、1行に1つのタイトル内容だけを表示したいのですが、タイトルの文字の幅（幅）が広すぎて制限されてしまう場合があり、その際に文字が自動的に折り返されてしまいます。もちろん、余分なテキストコンテンツを非表示にするために、CSS overflow:hidden スタイルを追加できます。

ホワイトスペース構文:

ホワイトスペース: 通常のnowrap

ホワイトスペースパラメータ:

normal: デフォルトの処理方法

nowrap: テキストの最後まですべてのテキストを強制的に同じ行に表示しますまたは br タグ オブジェクトに遭遇した場合は、行を変更するだけです。改行を強制的に行わないようにするには、white-space:nowrap を使用することをお勧めします。

white-space は、オブジェクト内のテキスト表示モードを設定または取得します。通常、これを使用して、コンテンツを強制的に 1 行で表示します

通常、white-space:nowrap を使用して、テキスト コンテンツが折り返されないよう強制し、オブジェクト内のすべてのテキスト コンテンツを 1 行で表示します。

私は 2 つのオブジェクト ボックスを設定しました。1 つの設定は、ピアにテキスト コンテンツを表示するように強制します。 2 番目の設定では、ピアを強制的に表示しますが、HTML br タグを使用して効果を観察します。ホワイトスペースケースの適用効果として、CSS の幅を 120 ピクセル、CSS の高さを 60 ピクセル、CSS の行の高さ line-height を 20 ピクセルに設定しました。

CSSコード

<style> 
div{ width:120px; height:60px; line-height:20px} 
.div{ white-space:nowrap} 
</style>

2. HTMLコードスニペット

<div class="div">内容将在一行内强制显示完整</div> 
<div class="div">内容使用br换行<br /> 
将会不被<br />换行显示</div>

毎日、テキストコンテンツを1行で表示するには、幅が足りない場合でも、空白スタイルを使用できます。ただし、HTML br 強制改行タグに遭遇すると、空白が設定されているかどうかに関係なく、
によって強制的に改行されます。

長らくホワイトスペースについて紹介してきましたが、必要な方は保存しておいてください。このサイトの他の更新情報にも引き続き注目してください。

関連記事:

HTMLでlabelタグを使用する方法

DIV背景画像の背景を設定する方法

HTMLのタイトルタグ要素を変更する方法

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