Як вирівняти тексти всередині вводу?

Для всіх вводів за замовчуванням текст, який ви заповнюєте, починається зліва. Як змусити його почати праворуч?

Використовуйте властивість вирівнювання тексту у своєму CSS:

input { 
    text-align: right; 
}

Це буде діяти на всіх входах сторінки.
В іншому випадку, якщо ви хочете вирівняти текст лише одного введення, встановіть стиль вбудованого стилю:

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

Спробуйте це у своєму CSS:

input {
text-align: right;
}

Щоб вирівняти текст у центрі:

input {
text-align: center;
}

Але його слід вирівняти ліворуч, оскільки це за замовчуванням - і, здається, є найбільш зручним для користувачів.

Ось вам :

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

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

Тут прийнята відповідь правильна, але я хотів би додати трохи інформації. Якщо ви використовуєте бібліотеку / фреймворк, наприклад завантажувальний інструмент, для цього можуть бути вбудовані класи. Наприклад, bootstrap використовує text-rightклас. Використовуйте його так:

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

Як примітка, це працює і для інших типів введення, як числових, як показано вище.

Якщо ви не використовуєте гарний фреймворк, як завантажувальний інструмент, тоді ви можете створити власну версію цього допоміжного класу. Подібно до інших відповідей, але ми не збираємось додавати їх безпосередньо до класу введення, тому він не застосовуватиметься до кожного введення на вашому веб-сайті чи сторінці, це може бути не бажаною поведінкою. Таким чином, це створило б хороший простий клас 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>

На даний момент не підтримується селектор: Підтримка браузера

@ Html.TextBoxFor (model => model.IssueDate, новий {@class = "form-control", ім'я = "inv_issue_date", id = "inv_issue_date", назва = "Вибрати дату випуску рахунка-фактури", placeholder = "dd / mm / yyyy ", style =" text-align: center; "})

Без CSS: Використовуйте властивість STYLE для введення тексту

STYLE = "Вирівнювання тексту: праворуч;"