对齐没有CSS或表的复选框？

如果我有一个HTML表单类似如下：对齐没有CSS或表的复选框？

<form name="statusForm" action="post.php" method="post" enctype="multipart/form-data"> 
Test: 
<input name="checkboxes[]" value="Test" type="checkbox"> 
<br> 
TestTestTest: 
<input name="checkboxes[]" value="Test" type="checkbox"> 
<br> 
TestTestTestTestTestTest: 
<input name="checkboxes[]" value="Test" type="checkbox"> 
<br> 
TestTestTestTestTestTestTestTestTestTestTest:  
<input name="checkboxes[]" value="Test" type="checkbox"> 
<br> 
<input name="Submit" value="submit" type="submit"> 
</form>

是否有可能对准复选框，以便他们在工会，而无需使用表或CSS，但纯HTML？否则，应该使用哪个css？

来源

2009-05-21 Josh20002

是。环绕每个标签具有<label>标签：

<label for="checkboxes1">Test:</label> 
<input id="checkboxes1" name="checkboxes[]" value="Test" type="checkbox">

然后给标签宽度：

label { 
    display: inline-block; /* try "block" instead if this fails in IE */ 
    min-width: 5em; 
}

应该垫的文本框很好。作为额外的好处，单击标签现在应该将浏览器焦点置于文本框中。

来源

2009-05-21 23:49:21

他不是说“无CSS”？ – cletus 2009-05-22 00:00:22

这确实使用最少量的CSS，（或任何其他形式的标记）。它也具有语义意义。++ Samir – 2009-05-22 00:25:47

我不明白你为什么要这样做。

它不符合你的没有css指令，但你可以使用内联样式，如果你真的只是想没有外部 css。

也许你可以使用 

CSS（以及在较小extent-表）是你正在寻找的工具。

编辑：另一种可以做到这一点的方法是使用鬼像素图像。图像是一个1x1 alpha透明png，并使用高度和宽度属性来告诉它你想要多少空间。你可能需要一些内联的css来确保事情清除正确。

来源

2009-05-21 23:49:43 jskulski

最简单的方法就是将它们都排列在右边。我不确定“align”属性是否适用于表单元素，但您可以尝试，或者使用align="right"）将代码包装在div或p元素中。

CSS是一个更好的解决方案。在表单上放置一个类，然后使用CSS规则text-align: right;或直接将style="text-align: right"直接添加到表单元素。

来源

2009-05-21 23:56:46 DisgruntledGoat

文章Applying CSS to forms有一些syling标签的例子，使右侧的输入沿着垂直边缘排列。

也就是说，在用户界面设计中将标签放置到右侧或单选按钮和复选框是一种惯例。如果你遵循这个约定，那么他们将自己排队（因为所有的复选框将分享一个宽度）。

来源

2009-05-22 08:24:28 Quentin

您可以将标签和输入放入无序列表中。为了得到对齐，文本将不得不对输入的右/

<ul> 
    <li> 
     <label><input /> Some Text</label> 
    </li> 
</ul>

或

<ul> 
    <li> 
     <input /><label for="">Some Text</label> 
    </li> 
</ul>

丰富

来源

2009-05-22 11:47:34 kim3er

对齐没有CSS或表的复选框？

回答

相关问题