HTML UI问题 - 我可以在INPUT type =文本框中有一个复选框吗？

Question

我正在使用html界面替换winforms屏幕，该界面需要在IE7 / 8/9＆amp; Firefox浏览器。

目前在我们的一个屏幕上，我们有一个时髦的输入控件，如下所示：

用户可以通过以下三种方式之一输入值：

1. 用户只需输入框
即可
2. 用户可以从下拉列表中选择一个项目
3. 用户可勾选“未打开”复选框，有效选择我们称之为“未打开”的已知项目

还有一个搜索按钮'...'，但这是另一个易于实现的控件。

我想用html重建它，我想知道如何替换Unopened函数，因为（a）和（b）很容易。我想我只是在INPUT框下面放一个单独的Unopened复选框而不是在它里面，因为那样会更简单。但如果有办法让它看起来像现在这样，我可能更喜欢它。那可能吗？

更新：

次要问题：如果我确实使用CSS将复选框放在INPUT框中，我只是带着奇怪的小可用性或布局问题给自己带来很多痛苦，或者这是不是太不寻常或难以做到的事情？

Answer 1

你可以把它放在一个单独的div中，然后用CSS定位它看起来就像在输入字段里面一样：

#checkbox {
position: relative;
top: -10px;
}

或您需要的任何值......

关于你的第二个问题：不。它实际上不是“在盒子里面”，它只是出现在那里。所有功能仍然存在。 =）

http://jsfiddle.net/BdBTy/是一个如何运作的简单示例。

Answer 2

将支票放在文本框右下方的html

中

在css中选中复选框

margin-top:-25px; 

（或您需要的任何确切数字）