html - 2 つのオブジェクトの間に水平スペースを入れる HTML は何ですか?

Question

私は答えを探していて、成功せずにさまざまなことを試みてきました。PHP コードを使用して 2 つのオブジェクトの間にスペースを入れる方法を教えてください。（注：違いが生じる場合に備えて、WordPressを使用しています。）

で垂直方向に行う方法は知っていますが</br>、それに相当する水平方向は何ですか?

私はコードについてよく知らないので、事前に提供できる詳細情報をいただければ幸いです。どうもありがとうございました。

score 12 · Accepted Answer

各オブジェクトにパディングを配置する必要があります。たとえば、画像間にスペースが必要な場合は、次を使用できます。

img{
   padding: 5px;
}

つまり、すべての面に 5px のパディンが必要です。詳しくはhttp://www.w3schools.com/css/css_padding.aspをご覧ください。ところで、プログラミングを試みる前にたくさん勉強することは、あなた (そして私たち) にとっても簡単になります。

score 8 · Accepted Answer

CSS

div.horizontalgap {
  float: left;
  overflow: hidden;
  height: 1px;
  width: 0px;
}

HTMLでの使い方（横10pxの場合）

<div class="horizontalgap" style="width:10px"></div>

score 3 · Accepted Answer

PHP はスタイリングを行いません。html または css を使用する必要があります。http://www.w3schools.com/tags/tag_hr.aspをご覧ください。

HTML 4.01 では、

タグは横罫線を表します。

In HTML 4.01, the <hr> tag represents a horizontal rule.

score 2 · Accepted Answer

まあ、これはおそらく嫌われますが、1 ピクセルの透明な画像を作成し、テキストの間で必要に応じてサイズを変更できます。

Some text <img src="spacer.png" height="1px" width="10px"> Some more text

1 つまたは 2 つのスペースが私のデザイン感覚に十分ではなかったときに、この問題に遭遇しました。

score 2 · Accepted Answer

2 つの段落 (たとえば) を上下に配置するのではなく、2 つの列に配置することを意味していると思いますか? その場合、私floatはあなたの解決策だと思います。

<div style="float: left"> <!-- would cause this to hang on the left -->
<div style="float: right"> <!-- would cause this to hang on the right-->

score 0 · Accepted Answer

要素間に水平スペースを追加する別の方法は、css でスペースを保持するようにラベルを設定することです。

label {
   white-space: pre;
}

..そして、必要な数のスペースを含むラベルを追加します。

<label>  </label>

9 に答える 9