Question

如何在HTML页面中的文本之间再获得五个空格？我经常起诉 但这还不够。

在下面的示例中，我需要在一行中的LANDMARK和STREET之间留出更多空间

<html>
    <body>
        LANDMARK:<input type="text" name="land_mark">&nbsp;&nbsp;
        SREET:<input type="text" name="street">&nbsp;&nbsp;
    </body>
</html>

Answer 1

您可以使用margin属性分隔彼此靠近的元素。

input {margin-right: 20px;}

然而，实现这一目标的更好方法是将标记更改为更加语义化， a demo here

HTML：

<div class="form_container">
    <form method="POST" name="form_name" class="some_form">
        <label for="land_mark">
            landmark
        </label>
        <input type="text" name="land_mark" id="land_mark" />

        <label for="street">
            street
        </label>
        <input type="text" name="street" id="street" />

    </form>
</div>

CSS

.some_form label {
  text-transform : uppercase;
  margin-right: 5px;
}

.some_form input {
  margin-right: 20px;
}

<强>更新

最好使用标签来表示输入操作： (source)

点击标签着重于文本字段，这是很多东西用户期望
对可访问性原因有帮助
用户怎么知道哪个字段是哪个？你可以吗只是文字或跨度或东西，但是你为什么这样？
它会导致更多的语义标记。

至于 没有用，最好是分离外观和内容，它有助于保持更清洁和可维护。最好只使用像margin-right : 10px这样的东西，而不是指定吨 

Answer 2

在这种特殊情况下（因为这两个单词在单独的标签中）是一个简单的

margin-left: 20px;

会做的。

但是你应该使用word-spacing CSS样式来实现这种效果而不需要＆amp; nbsp

Answer 3

接受一些css课程。使用css非常重要。保证金属性是一个很好的解决方案给你。但请了解一些CSS的知识。我敢打赌，这对你未来的计划会更有帮助

如何在html页面中的文本之间保留更多空间？

3 个答案: