HTML Element Style How to - Change font size for input

Question

We would like to know how to change font size for input.

Answer


<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
html, body {<!-- ww  w.  java  2 s.com-->
  font: 16px/18px 'Lucida Console', Monaco, monospace;
}

input {
  width: 150px;
  display: block;
}

form div {
  margin: 1em;
}

#b {
  font-size: 1em;
}
</style>
</head>
<body>
  <form action="#" method="post">
    <div>
      Default font family and size <input type="text" name="a" id="a"
        value="default size" />
    </div>
    <div>
      1em is larger! <input type="text" name="b" id="b"
        value="why is this larger?" />
    </div>
  </form>
</body>
</html>

The code above is rendered as follows: