直接上代码:
<style type="text/css">
.wrap{ font-size:12px;font-family:Arial,'simsun'; background:#ccc; margin-bottom:5px; line-height:30px;}
input { margin:0 5px 0 0 ; padding:0; vertical-align:middle }
.txt{ padding:6px;}
.label_a{ display:inline-block;}
</style>
HTML:
<div class="wrap">
<input type="text" class="txt" />发大水了开发大路口附近dasdfadfadfa
</div>
<div class="wrap">
<label for="radioA" class="label_a"><input type="radio" id="radioA" />发大水了开发大路口附近dasdfadfadfa</label>
</div>
<div class="wrap">
<label for="checkboxA" class="label_a"><input type="checkbox" id="checkboxA"/>发达了发的煎熬了房间的啦</label>
</div>
附图:

最后:
W3shool对vertical-align属性:
该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。
各浏览器,基本兼容,在IE8+、FF、chrome效果较好,IE6、7下还有些许不完美。
本文探讨了在实践中HTML输入框(input)的对齐问题,通过代码示例展示了如何使用vertical-align属性进行调整。W3School解释了vertical-align属性的作用,它用于定义行内元素的基线垂直对齐。尽管大多数现代浏览器如IE8+、Firefox和Chrome对这个属性有良好支持,但在IE6、7下仍存在兼容性问题。
4406

被折叠的 条评论
为什么被折叠?



