Wie kann man Texte innerhalb einer Eingabe ausrichten?

Bei allen Standardeingaben beginnt der von Ihnen eingegebene Text links. Wie lässt du es rechts anfangen?

Verwenden Sie die Textausrichtungseigenschaft in Ihrem CSS:

input { 
    text-align: right; 
}

Dies wird in allen Eingaben der Seite wirksam.
Wenn Sie andernfalls den Text nur einer Eingabe ausrichten möchten, legen Sie den Stil inline fest:

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

Versuchen Sie dies in Ihrem CSS:

input {
text-align: right;
}

So richten Sie den Text in der Mitte aus:

input {
text-align: center;
}

Es sollte jedoch linksbündig sein, da dies die Standardeinstellung ist - und am benutzerfreundlichsten zu sein scheint.

Los geht's :

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

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

Die hier akzeptierte Antwort ist korrekt, aber ich möchte ein paar Informationen hinzufügen. Wenn Sie eine Bibliothek / ein Framework wie Bootstrap verwenden, sind möglicherweise Klassen dafür integriert. Zum Beispiel verwendet Bootstrap die text-rightKlasse. Verwenden Sie es so:

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

Hinweis: Dies funktioniert auch bei anderen Eingabetypen, wie z. B. numerisch, wie oben gezeigt.

Wenn Sie kein nettes Framework wie Bootstrap verwenden, können Sie Ihre eigene Version dieser Hilfsklasse erstellen. Ähnlich wie bei anderen Antworten, aber wir werden es nicht direkt zur Eingabeklasse hinzufügen, sodass es nicht für jede einzelne Eingabe auf Ihrer Site oder Seite gilt. Dies ist möglicherweise nicht das gewünschte Verhalten. Dies würde also eine schöne, einfache CSS-Klasse erstellen, mit der die Dinge richtig ausgerichtet werden können, ohne dass ein Inline-Styling erforderlich ist oder jedes einzelne Eingabefeld beeinflusst wird.

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

Jetzt können Sie diese Klasse genauso verwenden wie die obigen Eingaben mit class="text-right". Ich weiß, dass es nicht so viele Tastenanschläge speichert, aber es macht Ihren Code sauberer.

Wenn Sie möchten, dass der Text nach dem Verlust des Fokus nach rechts ausgerichtet wird, können Sie versuchen, den Richtungsmodifikator zu verwenden. Dies zeigt den rechten Teil des Textes, nachdem Sie den Fokus verloren haben. zB nützlich, wenn Sie den Dateinamen in einem großen Pfad anzeigen möchten.

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>

Der Nicht-Selektor wird derzeit gut unterstützt: Browser-Unterstützung

@ Html.TextBoxFor (model => model.IssueDate, new {@class = "form-control", name = "inv_issue_date", id = "inv_issue_date", title = "Ausstellungsdatum der Rechnung auswählen", Platzhalter = "dd / mm / yyyy ", style =" text-align: center; "})

Ohne CSS: Verwenden Sie die STYLE-Eigenschaft der Texteingabe

STYLE = "Textausrichtung: rechts;"