如何在输入字段中移动文本？

debugcn 发表于 Dev

克里斯·格雷特（ChrisSlightGhost）

因此，我正在学习并尝试创建自己的网站。我有大多数想要的表单，但是我不确定如何从svg img清除占位符文本，以便清晰易读。一些帮助将不胜感激。

提前致谢。

.inputTagz{
    padding-left: 25px;
    cursor: text;
    font-size: 14px;
    float: left;
    width: 100%;
    font-size: px;
    padding-top: 11px;
    padding-bottom: 11px;
    margin-top:20px;
    font-weight:700;
}

#name{
    background-image: url("man.svg");
    background-size: 30px 30px;
    background-position: 11px 8px;
    background-repeat: no-repeat;
}

#emailPhone{
    background-image: url("mail.svg");
    background-size: 30px 30px;
    background-position: 11px 8px;
    background-repeat: no-repeat;
}

#password{
    background-image: url("lock.svg");
    background-size: 30px 30px;
    background-position: 11px 8px;
    background-repeat: no-repeat;
}
#formDiv{
    width: 450px;
    float: left;
    left: 50%;
}

约翰·雷伊·贝伦

您需要编辑占位符，您可以使用此

#emastrong textilPhone {
    background-image: url("mail.svg");
    background-size: 30px 30px;
    background-position: 11px 8px;
    background-repeat: no-repeat;
}

#password {
    background-image: url("lock.svg");
    background-size: 30px 30px;
    background-position: 11px 8px;
    background-repeat: no-repeat;
}

#emailPhone::-webkit-input-placeholder {
   padding-left: 25px;
}

#emailPhone::-moz-placeholder {
    padding-left: 25px;
}
#emailPhone:-moz-placeholder {   /* Older versions of Firefox */
    padding-left: 25px;
}
#emailPhone:-ms-input-placeholder { 
    padding-left: 25px;
}

#password::-webkit-input-placeholder {
   padding-left: 25px;
}

#password::-moz-placeholder {
    padding-left: 25px;
}
#password:-moz-placeholder {   /* Older versions of Firefox */
    padding-left: 25px;
}
#password:-ms-input-placeholder { 
    padding-left: 25px;
}

请检查有关如何编辑占位符的最新更新。谢谢，希望对您有所帮助。

试试这个代码...

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。