如何在输入中对齐文本?

在CSS中使用text-align属性:

input {
text-align: right;
}

该参数将在该页面的所有输入中生效 否则，如果你只想对齐一个输入的文本，设置样式inline:

<input type="text" style="text-align:right;"/>

给你:

input[type=text] { text-align:right }

<form>
<input type="text" name="name" value="">
</form>

在你的CSS中试试这个:

input {
text-align: right;
}

要使文本在中间对齐:

input {
text-align: center;
}

但是，它应该是左对齐的，因为这是默认的-并且看起来是最用户友好的。

风格= " text-align:权利;"

这里公认的答案是正确的，但我想补充一点信息。如果你正在使用一个库/框架，如bootstrap，可能有内置的类。例如，bootstrap使用text-right类。像这样使用它:

<input type="text" class="text-right"/>
<input type="number" class="text-right"/>

值得注意的是，这也适用于其他输入类型，如上面所示的数字。

如果你没有使用bootstrap这样的框架，那么你可以创建自己版本的这个helper类。类似于其他答案，但我们不打算直接将其添加到输入类中，因此它不会应用于您网站或页面上的每个输入，这可能不是理想的行为。所以这将创建一个很好的简单的css类来对齐东西，而不需要内联样式或影响每个输入框。

.text-right{
text-align: right;
}

现在你可以像上面的class="text-right"输入一样使用这个类。我知道这并没有节省很多按键，但它使你的代码更干净。

如果你想让它在文本失去焦点后向右对齐，你可以尝试使用方向修饰器。这将显示文本在失去焦点后的正确部分。例如，如果你想在一个大的路径中显示文件名，这很有用。

input.rightAligned {
direction:ltr;
overflow:hidden;
}
input.rightAligned:not(:focus) {
direction:rtl;
text-align: left;
unicode-bidi: plaintext;
text-overflow: ellipsis;
}

<form>
<input type="text" class="rightAligned" name="name" value="">
</form>

not选择器目前很受支持:浏览器支持

@Html。TextBoxFor(model =>模型。IssueDate, new {@class = "form-control"， name = "inv_issue_date"， id = "inv_issue_date"， title = "Select Invoice开票日期"，placeholder = "dd/mm/yyyy"， style = "text-align:center;"})

以下方法可能对你有用:

<style>
input {
text-align: right !important;
}
textarea{
text-align:right !important;
}
label {
float: right !important;
}
</style>

引导5现在是class="text-end":

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">


<input step="any" id="myInput" type="number" class="text-end">