Heim > Web-Frontend > CSS-Tutorial > Wie erstelle ich einen Textumbruch in einer HTML-Schaltfläche mit fester Breite?

Wie erstelle ich einen Textumbruch in einer HTML-Schaltfläche mit fester Breite?

Mary-Kate Olsen
Freigeben: 2024-10-30 16:08:52
Original
498 Leute haben es durchsucht

How to Make Text Wrap in a Fixed-Width HTML Button?

Text in Schaltflächen mit fester Breite umbrechen

Wenn Sie auf ein Problem stoßen, bei dem eine HTML-Schaltfläche mit fester Breite ihren Text nicht umbricht Erwägen Sie die Verwendung des folgenden Ansatzes:

Schaltfläche mit fester Breite und umbrechendem Text

Sie können der Schaltfläche die Fähigkeit zum Zeilenumbruch gewähren, indem Sie die CSS-Eigenschaft „Leerzeichen“ verwenden. Durch die Einstellung „white-space: normal“ weisen Sie den Browser an, den Text wie normalen Text außerhalb einer Schaltfläche umzubrechen.

Beispiel:

<code class="css">td.category_column input[type="submit"] {
  white-space: normal;
  /* Other CSS styles */
}</code>
Nach dem Login kopieren

Erklärung:

Das bereitgestellte Codebeispiel fügt „white-space: normal“ zur CSS-Klasse hinzu, die im ursprünglichen HTML-Snippet auf die Schaltfläche angewendet wird. Dadurch wird das Verhalten der Schaltfläche geändert, während die feste Breite und andere Stile beibehalten werden. Dadurch wird der Text innerhalb der Schaltfläche jetzt wie in einer typischen Tabellenzelle umbrochen.

Das obige ist der detaillierte Inhalt vonWie erstelle ich einen Textumbruch in einer HTML-Schaltfläche mit fester Breite?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage