使用跨度边距来对齐文本

Question

对html有点新,所以如果需要进一步解释或者这个问题没有意义,请随意说出来.

我正在使用div来布局我正在设计的webform并使用 来移动div中的文本并不总是产生我想要的结果到页面的布局.

我开始尝试并使用:

<span style="margin-left:(variable)px"></span>

我能够将文本准确地移动到我想要的位置.

我的问题是,这是一种不好的做法吗？有没有更好的方法来做我想做的事情,或更传统的方式？或者甚至是html内置的东西,我还没有发现.

谢谢

*添加了代码块以显示我想要完成的任务

   Complainant's Address
   <input type="text" size="50" id="complainantAddress"/> 
   <span style="margin-left:3px"></span>
   City
   <input type="text" name="city" maxlength="15" size="15"/>
   <span style="margin-left:16px"></span>
   State
   </div>

Answer 1

使用不易碎的空间进行布局/定位是不好的做法.您尝试使用style属性做得更好,但内联样式属性通常也被认为是不好的实践.
样式属性很难维护,并且您复制了大量信息等.此外,这种样式具有最高的特异性,不能被其他样式(如用户CSS文件)覆盖.应谨慎使用它们.

使用CSS属性margin,padding而text-align这一点.

示例
http://jsfiddle.net/UYUA7/

HTML

Text<br />

&nbsp;&nbsp;&nbsp;&nbsp;Text <!-- Do NOT use this -->

<div class="center">Center</div>
<div class="right">Right</div>
<div class="indent">Indented</div>

CSS

.center {
    text-align: center;
}

.right {
    text-align: right;
}

.indent {
    margin-left: 20px;
}