input文本和label对齐

默认状态下,也就是下面这样, 文字和input是居中的。

<div>
    <label>我是中国人</label>
    <input type="text"></div>

但是经常设计图中有label的行高,或者input的高度设计,默认状态下,依然是居中的。但是很多时候label和input要浮动,一旦浮动,后面的input标签就紧紧的贴住了label标签,也就造成了视觉上看到并没有居中。

比如下面:

<div>
    <label>我是中国人</label>
    <input type="text"></div>label {
    font-size: 12px;    float: left;
}input {    height: 20px;
}

网友评论