我想使用Div和其他元素显示这种类型的数据,例如ul li p span可能是最小标签。
注意:可重复的块和左内容右对齐,右内容左对齐。
请用最少的代码为此提供良好的解决方案。
以下是我尝试用UL-LI做的链接
wazdeisgn
<dl>
<dt>user</dt><dd>3234234234234</dd>
<dt>something</dt><dd>3234234234234</dd>
<dt>wharever</dt><dd>3234234234234</dd>
</dl>
dl { float: left; width: 300px; height: auto; margin-bottom: 5px; }
dt { float: left; width: 100px; height: auto; text-align:right; }
dd { float: right; width: 200px; height: auto; text-align:left; }
当然你之前应该有一个很好的“css重置”,因为默认的填充和边距不会影响你的盒子模型。
首先,将标签放在div或span容器中,并将值放在它们自己的容器中。为标签指定一个类,例如“label”。
接下来,在你的css中,向左浮动标签并给它们一个固定的宽度。将标签类的text-align属性设置为“right”。
如果您认为值将换行到下一行,则还将值容器浮动;这将阻止它们包裹在与标签相同的垂直空间中。如果你这样做,请确保每个标签也有明确的:左应用,以便它自己开始。