如何将填充添加到输入字段文本[CSS]

我有一个简单的问题，我知道我可以使用CSS编辑输入字段的占位符文本。但我想知道如何在实际文本（用户键入的文本）中添加填充。我在下面提供了一个图像，我在占位符文本中添加了填充，但我正在努力为输入字段的实际文本添加填充，以便它与占位符文本对齐

以下是我尝试过的：

.form TextInput {
  padding-left: 10px;
}

这显然不起作用，我只是想知道是否还有其他人有解决办法

编辑：我不想移动输入字段本身，只想移动其中的文本。就像我对占位符所做的那样，但这次我只想移动文本以匹配占位符的位置

---

您必须为输入字段指定css，如下所示

.form input[type="text"]{
  padding:10px;
}

---

检查输入上的此小提琴填充；对于在字段或预设值参数中键入的用户：

.form input[type="text"] {
    box-sizing: border-box;
    padding-left: 10px;
}

占位符上的填充：

.form input::placeholder {
    padding: 10px;
}

---

1-填充输入，用户可以在其中键入：

.form input.TextInput { 
  padding-left: 10px;
}

2-输入占位符的填充：

.form input.TextInput::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  padding-left: 10px;
}
.form input.TextInput::-moz-placeholder { /* Firefox 19+ */
  padding-left: 10px;
}
.form input.TextInput:-ms-input-placeholder { /* IE 10+ */
  padding-left: 10px;
}
.form input.TextInput:-moz-placeholder { /* Firefox 18- */
  padding-left: 10px;
}

---

使用css前缀实现跨浏览器兼容性。

什么是TextInput？@melvin它没有任何意义，我只是用它来解释我要做的事情。这会将整个输入字段向左移动10个像素。我想移动输入字段中的文本。@howdydoo这不会移动输入-你把

填充

和

边距

@混淆了哦，我的错。但我不明白，如果不移动实际输入字段本身，我如何才能在输入字段内移动实际文本？@howdydoo检查我答案中的小提琴或@howdydoo。希望有帮助。如果是真的，请将其标记为aswer。我只是想移动文本，而不是输入字段本身。当然，只需在占位符上添加一个填充，而不是输入。我在占位符上添加了填充。现在，我想在用户输入某些文本时显示的实际文本中添加填充。是的，我提供了占位符填充和输入填充-当用户输入某些文本时，将显示目标输入。实际上，情况正好相反。我想要在实际文本上填充，我已经在占位符上填充了，如我提供的第一个链接所示。我想将文本（而不是占位符）向右移动，而不移动输入字段本身。