Schnellstart: Anzeigen von Text (HTML)

[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation ]

Für Windows Store-Apps mit JavaScript können verschiedene Elemente zum Anzeigen von Text verwendet werden. Die primären Elemente zum Anzeigen von schreibgeschütztem Text umfassen label, div, paragraph und heading. Diese Schnellstartanleitung zeigt Ihnen, wie Sie diese Elemente zum Anzeigen von Text verwenden.

Sehen Sie dieses Feature in unserer Reihe App-Features von A bis Z in Aktion.: Windows Store-App-Benutzeroberfläche von A bis Z

Voraussetzungen

• Es wird davon ausgegangen, dass Sie eine einfache Windows Store-App mit JavaScript erstellen können, in der die Vorlage der Windows-Bibliothek für JavaScript verwendet wird. Informationen zum Erstellen der ersten App finden Sie unter Erstellen Ihrer ersten Windows Store-App mit JavaScript.

Bezeichnung, DIV, Absatz und Textbereich

Label, div, paragraph und heading sind die primären Steuerelemente zum Anzeigen von schreibgeschütztem Text in Windows Store-Apps mit JavaScript. Der folgende HTML-Code zeigt, wie ein einfaches label-Steuerelement definiert und der zugehörige Text festgelegt wird.

<label>Hello, World!</label>

Sie können das Inlineattribut style verwenden, um Text mit einer anderen Formatierung anzuzeigen. So verwenden Sie das style-Attribut mit einem div-, paragraph-, label- und heading-Steuerelement zum Definieren mehrerer unterschiedlich formatierter Textzeichenfolgen.

Hinweis  Anstelle des style-Attributs können Sie auch CSS (Cascading Style Sheets) verwenden, um Text mit einer anderen Formatierung anzuzeigen. Dies ermöglicht Ihnen das einmalige Definieren eines Stils und die Referenzierung dieses Stils in mehreren Steuerelementen. Wenn später Änderungen am Stil erforderlich sind, müssen Sie diese Änderungen nur an einer Stelle vornehmen. Einzelheiten dazu finden Sie unter Cascading Style Sheets.

<div style="font-family:Arial">Sample text formatting runs</div>

<!-- 'margin:0px' removes any default margins from the <p> element. -->
<p style="margin:0px; color:lightgray; font-family:'courier new'; font-size:24px">Courier New 24</p>

<label style="color:teal; font-family:'times new roman'; font-style:italic; font-size:18px">Times New Roman Italic 18</label><br />
    
<!-- 'padding:0px' remove any default padding from the <h1> element. -->
<h1 style="padding:0px; background-color:transparent; color:steelblue; font-family:Verdana; font-weight:bold; font-size:14px">Verdana Bold 14</h1>

Dies ist das Ergebnis.

Zusammenfassung und nächste Schritte

Sie haben erfahren, wie Sie label-, div-, paragraph- und heading-Elemente erstellen, um Text in Ihrer App anzuzeigen.

Verwandte Themen

Richtlinien für Schriftarten

Schnellstart: Hinzufügen von Steuerelementen für Texteingabe und -bearbeitung