HTML - Formularbuttons selbst gestalten...Ein neue Tag in HTML 4.0 erlaubt es, Buttons in Formularen selbst zu gestalten. Sie können die Texte definieren, welche ausgegeben werden sollen, oder sie öganze Grafiken einbinden. In Verbindung mit CSS wird das ganze noch besser...

In HTML 4.0 könne Sie außer den Standardbuttons für Formulare, eigene Buttons gestalten. Es steht ihnen dazu ein neue Tag zur Verfügung, der <button>-Tag.

<button name="send" type="submit" value="">

</button>

Zwischen die beiden Tags können Sie jeden beliebigen HTML-Inhalt ausgeben. Der Button wird durch das type="" Attribut genauer bestimmt. Es gibt die selben Werte wie bei den vordefinierten Buttons.

Eine Möglichkeit der Gestaltung eines Buttons sieht so aus:


Das Ergebnis

Der Code dafür:

<button name="send" type="submit" value="Ab gehts!">
<p><b>Los gehts!</b><br><img src="logo.gif"></p>
</button>

Eben wie in einfache HTML. Sie können aber noch weiter gehen, und mit CSS zusätzlich arbeiten. So können Sie aus ihrem Button schnell ein Objekt der Kunst machen.

Das Ergebnis


Der Code:

<button name="send" type="submit" value="Ab gehts!" style="background-color:#FFFFFF; border: 2 dotted red">
<p><b>Los gehts!</b><br><img src="tf.jpg"></p>
</button>

Oder so vielleicht?

Der Code:

<button name="send" type="submit" value="Ab gehts!" style="background-color:#186095; border: 2 inset blue; font-size:1pt; font-face:Verdana; color:white">
<p><b>Los gehts!</b><br><img src="tf.jpg"></p>
</button>

Bookmark setzen... These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Bloglines
  • MisterWong
  • MySpace
  • Reddit
  • SEOigg
  • Technorati
  • TwitThis
  • Y!GG
  • Google Bookmarks

Weiterführende Links: