Posted By

herrfischerhamburg on 05/17/11


Tagged

form css simple


Versions (?)

simple form


 / Published in: HTML
 

  1. <!doctype html>
  2. <html lang="en">
  3. <meta charset="utf-8" />
  4. <title>...</title>
  5. <style type="text/css">
  6. body {
  7. background-color: #999;
  8. }
  9. #searchform {
  10. background:url(bilder/form-pic.png) 0 0 no-repeat;
  11. display:inline-block;
  12. width:400px;
  13. }
  14. #searchform label {
  15. display:none;
  16. }
  17. #theformfield {
  18. float:left;
  19. width:210px;
  20. border:none;
  21. background:none;
  22. height:40px;
  23. line-height:40px;
  24. padding-left:14px;
  25. padding-right:14px;
  26. padding-top:3px;
  27. color:#ccc;
  28. font: 16px bold Arial, Helvetica, sans-serif;
  29. }
  30. .thebutton {
  31. float:left;
  32. width:85px;
  33. height:40px;
  34. padding-top:2px;
  35. line-height:40px;
  36. cursor:pointer;
  37. border:none;
  38. background:none;
  39. color:#777;
  40. font: 14px bold Arial, Helvetica, sans-serif;
  41. }
  42. </head>
  43. <form action="#" method="post" target="_blank">
  44. <div id="searchform" class="cf">
  45. <div id="173753" rel="email">
  46. <label>E-Mail:</label>
  47. <input id="theformfield"
  48. name="email"
  49. type="text"
  50. value="Your Mail Adress"
  51. onFocus="if(this.value=='Your Mail Adress')
  52. this.value='';"
  53. onBlur="if(this.value=='')
  54. this.value='Your Mail Adress';">
  55. </div>
  56. <div id="173755" rel="button" class="thebutton">
  57. <input type="submit" value="Send it!" class="thebutton">
  58. </div>
  59. <!--searchform-->
  60. </div>
  61. </form>
  62. </div>
  63. </body>
  64. </html>

Report this snippet  

You need to login to post a comment.