HTML: Textarea erstellen – So gehts

Eine Textarea zu Deutsch Textbereich ist ein Feld in HTML wo der Benutzer einen Text eingeben kann der mehrere Zeilen oder auch nur eine lang sein kann. Wie du eine Textarea in HTML erstellen kannst zeige ich dir in diesem Beitrag.

So kannst du in HTML eine Textarea erstellen:

Die einfachste und gebräuchlichste Methode zum Erstellen einer Textarea in HTML ist die Verwendung des <textarea>-Elements. Dieses Element ermöglicht es Benutzern, mehrzeiligen Text einzugeben.

Grundstruktur:

<textarea rows="5" cols="30">
  Dein Text hier
</textarea>

Ergebnis

Attribute für die Textarea:

• rows: (optional) Legt die Anzahl der sichtbaren Zeilen fest. Standardwert ist 2.
• cols: (optional) Legt die Breite der Textarea in Zeichen fest. Standardwert ist 20.
• name: (erforderlich) Legt einen Namen für die Textarea fest, der beim Senden des Formulars verwendet wird.
• placeholder: (optional) Fügt einen Platzhaltertext ein, der im Feld angezeigt wird, wenn es leer ist.
• readonly: (optional) Macht die Textarea schreibgeschützt.
• required: (optional) Macht die Eingabe in der Textarea erforderlich.

Weitere Attribute:

• wrap: (optional) Legt fest, wie der Text innerhalb der Textarea umbrochen wird. Mögliche Werte: „hard“ (Zeilenumbruch nur an Zeilenenden), „soft“ (automatischer Zeilenumbruch) und „off“ (kein Zeilenumbruch).
• spellcheck: (optional) Aktiviert oder deaktiviert die Rechtschreibprüfung für den Text in der Textarea.
• autofocus: (optional) Setzt den Fokus automatisch auf die Textarea, wenn die Seite geladen wird.

Hinweis:

• Du kannst den Inhalt der Textarea mit dem Attribut value vordefinieren.
• Du kannst CSS verwenden, um das Aussehen der Textarea anzupassen, z. B. Schriftart, Farbe und Rahmen.
• Textareas werden häufig in Formularen verwendet, um Benutzern die Eingabe von mehrzeiligem Text zu ermöglichen.

Beispiele:

Eine einfache Textarea:

<textarea name="kommentar" rows="5" cols="30" placeholder="Schreibe deinen Kommentar hier..."></textarea>

Ergebnis

Eine Textarea mit aktivierter Rechtschreibprüfung und automatischem Fokus:

<textarea name="nachricht" rows="10" cols="60" spellcheck="true" autofocus></textarea>

Ergebnis

Eine Textarea mit vordefiniertem Inhalt:

<textarea name="beschreibung" rows="8" cols="40" value="Bitte beschreibe dein Produkt hier..."></textarea>

Ergebnis

Über mich

Domi

Hi ich bin’s Dominik. Auf Blogseite.com findest du alles was mich interessiert. Mag Games, liebe SEO, programmiere gerne und möchte dir mit verschiedenen Themen die mich begeistern einen Mehrwert liefern. Viel Spaß auf meiner Seite