html - 如何使用 div 包含和定位输入？

Question

如何将输入框完美地放置在 div 中？

这是 HTML:

<div class="field">
    <input type="text" id="field1">

    </div>

这是 CSS:

#field1 {
    width: 100%;
    border: 0;
}
.field {
    border: 1px solid blue;
    width: 160px;
}

这是一个 fiddle :http://jsfiddle.net/mtuj99n2/2/

Answer 1

在 css 中有许多不同的属性供您使用，您可以使用它来完成此操作。我这里只有一个示例:

#inputField {

width: 90%;
height: 100%;
border: 1px solid red;
margin-left: 5px;
margin-top:5px;
}