Html 向输入表单添加图标，并在图标后开始输入。

这对你们中的一些人来说是一个简单的问题，但我不是CSS和样式设计的最佳人选，我更喜欢后端开发。基本上，我正在设计一个登录表单的样式，我希望它看起来像这样：

背景、登录按钮都很好。简单

我使用了一些CSS，可以在输入中插入一个图标，但是当用户开始键入时，它会在图标上键入。我想做的是将图标部分分开，用户在绿线后开始键入

#password {

    background-image:url('../images/pw_icon.png');
    background-repeat:no-repeat;
    height: 30px;
}

这就是我到目前为止的CSS。我已经看到了这一点，但在谷歌搜索了几次之后找不到任何例子

有人能给我举个例子，或者用一些词给我指出正确的方向吗？

CSS

#password {
    background-image:url('../images/pw_icon.png') no-repeat center left;
    height: 30px;
    padding-left: 30px;
}

这应该对你有用