HTML Button Generator
Flexibler als <input type="submit">: erlaubt Icons + Text, mehrere Zeilen Inhalt.
Anwendung & Beispiele
Ohne type ist ein <button> innerhalb eines Formulars automatisch type="submit" – immer explizit setzen!
FAQ
Was ist der Default-type von <button>?
Innerhalb eines <form> ist es submit — das kann zu unerwartetem Form-Submit führen, wenn du den Button für etwas anderes nutzen willst. IMMER type="button", type="submit" oder type="reset" explizit setzen.
Wie style ich einen <button> wie einen Link?
button { all: unset; cursor: pointer; color: blue; text-decoration: underline; } — semantisch besser als ein <a>-Tag mit href="#" und onclick.
Kann ich Icons in einem <button> verwenden?
Ja, <button> erlaubt beliebigen HTML-Inhalt: <button><svg>…</svg> Speichern</button> oder Font-Icons. Bei Icon-only-Buttons immer aria-label setzen.
Wofür sind ID, Class und Title?
id identifiziert ein Element eindeutig (für CSS, JS, Anker-Links). class erlaubt CSS-Styling, mehrere Klassen werden mit Leerzeichen getrennt. title erzeugt einen Tooltip beim Hover.
Funktioniert der Code in allen Browsern?
Alle hier erzeugten Elemente sind valides HTML5 und werden in allen modernen Browsern (Chrome, Firefox, Safari, Edge, Opera) unterstützt. Bei sehr alten Browsern (z.B. IE 11) kann es bei einzelnen Input-Typen wie color oder date Einschränkungen geben.