HTMLのフォント配置を前の行に設定する方法

HTML では、次の手順を使用して、フォントを前の行に揃えることができます。 1. テキストを、span や div などのインライン ブロック レベル要素で囲みます。 2. display: inline- を使用します。 block を使用して要素をインライン ブロック レベルの要素に設定します。 3. text-align 属性を使用して、テキストを前の行に揃えます (左/右/中央など)。

HTML フォントの配置を前の行に設定する方法

HTML では、text を使用できます。 -align プロパティを使用してテキストの配置を設定します。ただし、テキストを前の行に揃えるには、CSS のコツが必要です。

ステップ 1: インライン ブロック レベル要素を使用する

まず、テキストを span などのインライン ブロック レベル要素で囲みます。または div。これにより、テキストを同じ行で折り返すことができるため、配置が柔軟になります。

<code class="html"><span>文本 1</span><span>文本 2</span></code>

ステップ 2: 要素をインライン ブロック レベル要素に設定します

display: inline-block スタイルを使用して要素を次のように設定しますインラインブロックレベル要素である必要があります。これにより、テキストを同じ行で折り返すことができますが、ブロックレベル要素の特性は維持されます。

<code class="css">span {
  display: inline-block;
}</code>

ステップ 3: テキストの配置を設定する

最後に、text-align プロパティを使用して、テキストを前の行に配置します。

<code class="css">span {
  text-align: left;
}</code>

text-align を right または center に設定すると、テキストをテキスト ボックスの右端または中央に揃えることができます。

サンプル コード

以下は、上記の手順を使用したサンプル コードです。

<code class="html"><style>
  span {
    display: inline-block;
    text-align: left;
  }
</style>

<span>文本 1</span><span>文本 2</span></code>

このスタイルを適用すると、「Text1」は同じになります。次の行の文字数に関係なく、「Text1」2 インチの配置として配置されます。

以上がHTMLのフォント配置を前の行に設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。