在input标签中添加一个icon图标基本可以分为两种
1.将icon图标存储为本地图片，然后设置为input的背景图，然后通过background-position来调整图标在输入框的位置
2.使用一个div包裹两个子div，其中第一个div里面包裹icon图标，另一个div包裹input标签，并设置input的border为none，然后让input标签撑满div，设置div的border，然后使用flex布局使两个子div成行排列，并让两个div撑满父div（height，width）
第一种：
#user {
background: url("img/user.png") no-repeat;
background-position: 10px 8px;
}
#password {
background: url("img/password.png") no-repeat;
background-position: 10px 9px;
}
第二种
#container {
height: 20%;
width: 90%;
display: flex;
flex-flow: row nowrap;
align-items: center;
}
#icon {
height: 2rem;
width: 2rem;
box-sizing: border-box;
padding: 5px;
}
#input {
border: 1px solid #ccc;
}
form input {
border: none;
cursor: pointer;
width: 100%;
height: 100%;
}
