Что HTML имеет горизонтальное пространство между двумя объектами?

Я искал ответ и пробовал разные вещи без успеха. Может кто-нибудь любезно дать мне знать, как положить пробелы между двумя объектами, используя PHP-код? (Обратите внимание: я использую WordPress, если это имеет значение.)

Я знаю, как сделать это по вертикали с помощью </br>, но что такое горизонтальный эквивалент?

Обратите внимание, что я не знаю много о коде, поэтому любая подробная информация, которую вы можете предоставить, очень ценится заранее - большое спасибо!

Ответы

Ответ 1

Я предполагаю, что вы хотите:

&nbsp;

Но это, как правило, не очень удобно выравнивать содержимое. Вы лучше поместите свой другой контент в

<div>

а затем используйте css для правильного выравнивания.


Вы также можете проверить этот пост с полезной дополнительной информацией:

Ответ 2

Вы должны поместить дополнение в каждый объект. Например, вам нужно пространство между изображениями, вы можете использовать следующее:

img{
   padding: 5px;
}

Это означает, что 5px paddin для сторон ALL. Подробнее читайте на http://www.w3schools.com/css/css_padding.asp. Кстати, много изучать, прежде чем пытаться программировать, облегчит вам (и для нас).

Ответ 3

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.

Ответ 4

CSS

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

Использование в HTML (для горизонтального зазора 10 пикселей)

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

Ответ 5

Я думаю, что вы имеете в виду два абзаца (например) в 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-->

Вот пример: http://jsfiddle.net/XPfLA/1

Ответ 6

Ну, это, вероятно, нахмурило, но вы можете сделать прозрачное изображение 1px, а затем размер по мере необходимости между текстом.

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

Я столкнулся с этой проблемой, когда одного или двух мест просто не хватало для моей дизайнерской чувствительности.

Ответ 7

Другим способом добавления горизонтального пространства между элементами является установка меток для сохранения пробелов в css:

label {
   white-space: pre;
}

.. и затем добавьте метку с таким количеством пробелов, сколько хотите:

<label>  </label>

Ответ 8

Вы можете использовать старые способы. И используйте таблицу. В таблице вы определяете 3 столбца. Вы устанавливаете ширину всей таблицы и определяете ширину каждого столбца. таким образом вы можете горизонтализовать пространство 2 объекта. Вы помещаете объект внутри ячейки1 (colum1, row1) и object2 в cell3 (colum 3, row 1), и вы оставляете ячейку 2 пустой. Учитывая, что он имеет ширину, вы увидите пустое пространство. Пример

<table width="500">
    <tr>
        <td width="40%">
            Object 1
        </td>
        <td width="20%">

        </td>
        <td width="40%">
            Object 2
        </td>
    </tr>
</table>

Или вы могли бы пойти лучше с div. Просто поместите свои объекты в divs. Добавьте средний div и поместите эти 3 div в другой div. В стиле css для верхнего div: overflow: auto и укажите ширину. Добавьте стиль css в 3 divs, чтобы определить их ширину и добавить float: left Пример

<div style="overflow: auto;width: 100%;">
    <div style="width:200px;float: left;">
        Object  1
    </div>
    <div style="width:200px;float: left;">

    </div>
    <div style="width:200px;float: left;">
        Object  2
    </div>
</div>