HTML Form How to - Make a submit button with text and image

Question

We would like to know how to make a submit button with text and image.

Answer


<!--from w  ww . j  ava 2  s  .c om-->
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css"
  href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css">
<link rel="stylesheet" type="text/css"
  href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
<style type='text/css'>
.stylish {
  font-family: georgia, FontAwesome;
}
</style>
</head>
<body>
  <code>input type="submit"</code>
  <form name="signin" action="#" method="POST">
    <input type="text" name="text-input"
      placeholder="&#xf183; your username" class="stylish" /><br /> 
    <input type="submit" value="&#xf090; sign in" class="stylish" />
  </form>
  <br /> 
  <code>button type="submit"</code>
  <form name="signin" action="#" method="POST">
    <input type="text" name="text-input"
      placeholder="&#xf0ac; where do you want to go?" class="stylish" /><br />
    <button type="submit" class="stylish">&#xf072; take me there</button>
  </form>
</body>
</html>

The code above is rendered as follows: