Maison >interface Web >tutoriel HTML >如何让td中的checkbox左对齐？？_html/css_WEB-ITnose
如何让td中的checkbox左对齐？？_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 12:18:152370parcourir
一个td，宽度是固定的，比如说是230px，高度可以伸缩，无所谓。
有N个 checkbox框 要显示在这个td里，checkbox后的显示字符长度也不确定，
比如说，有的是4个汉字，有的是2个汉字，等等。
该怎么弄，才能保障，checkbox都是左对齐的呢？
只需要在IE6中显示成左对齐即可。
回复讨论(解决方案)
如果要求checkbox和文本不换行，那就把div改为span并在span之间+br。
我这实现了，2种方法，跟大家共有下。
方法1：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head> <title>Untitled</title> <style> label{ white-space:nowrap; } </style></head><body><table border=1> <tr> <td width="350px" style="layout-grid-type: strict;"> <label for='a1'><input id='a1' type="checkbox">さふぁ</label> <label><input type="checkbox">あｓasあs化fｄふぁ</label> <label><input type="checkbox">ふぁあｄふぁｓｄふぁｓふぁ</label> <label><input type="checkbox">あえｒ</label> <label><input type="checkbox">123123123123123123123123123123123123123123</label> <label><input type="checkbox">あｄｆさｓｄふぁ</label> <label><input type="checkbox">あｓｄふぁ</label> <label><input type="checkbox">ふぁふぁ</label> <label><input type="checkbox">あえあｓｄふぁｓｄｆｒ</label> <label><input type="checkbox">aaaa</label> <label><input type="checkbox">さふぁ</label> <label><input type="checkbox">あｓｄふぁ</label> <label><input type="checkbox">ふぁふぁ</label> <label><input type="checkbox">あえｒ</label> </td> </tr></table></body></html> 方法2：
<div style="width:200px;border:1px solid;"><span style="display:inline-block"><input type="checkbox" name="chkJobType" id="1" />你好中国中国中国</span><span style="display:inline-block"><input type="checkbox" name="chkJobType" id="2" />你</span><span style="display:inline-block"><input type="checkbox" name="chkJobType" id="2" />你中</span><span style="display:inline-block"><input type="checkbox" name="chkJobType" id="2" />你好中国中国中国中国中</span><span style="display:inline-block"><input type="checkbox" name="chkJobType" id="2" />你好</span></div>
我这实现了，2种方法，跟大家共有下。
方法1：
XML/HTML code?12345678910111213141516171819202122232425262728293031323334353637nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
style="text-align:left" 设置样式不行吗
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：这个怎么实现啊,谁会啊,标题要长。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。_html/css_WEB-ITnoseArticle suivant：xhtml下滤镜怎么不起作用了!_html/css_WEB-ITnose