Styling Form In CSS

now I give a simple example how to styling form in CSS. I divide in two part, one is HTML script and other is CSS script.

here an HTML part



< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head>
< meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
< title>Styling Form Example< /title>
< /head>
< body>
< form id="form1" action="act/" method="post">
< fieldset id="name">
< legend>Name< /legend>
< label for="title">Title< /label>
< select id="title1" name="title1">
< option selected="selected">Mr.< /option>
< option>Mrs.< /option>
< option>Ms.< /option>
< /select>
< label for="firstname">First name< /label>
< input id="firstname" name="firstname" type="text" />
< label for="lastname">Last name< /label>
< input id="lastname" name="lastname" type="text" />
< br />
< /fieldset>
< fieldset id="address">
< legend>Address< /legend>
< label for="street">Street< /label>
< input id="street" name="street" type="text" />
< br />
< label for="city">City< /label>
< input id="city" name="city" type="text" />
< label for="state">State< /label>
< input id="state" name="state" type="text" />
< label for="zip">Zip code< /label>
< input id="zip" name="zip" type="text" />
< br />
< label for="country">Country< /label>
< input id="country" name="country" type="text" />
< br />
< /fieldset>
< fieldset id="submit">
< br />
< input type="submit" value="Submit" />
< br />
< /fieldset>
< /form>
< /body>
< /html>

then now apply this CSS :

< style type="text/css">
body{
background-color:#000000;
}
fieldset{
background-color:#3399FF;
width:450px;
}
legend{
color:#FFFFFF;
font-weight:bold;
font-size:16pt;
}
label {
display: block;
float: left;
clear: left;
width: 9em;
padding-right: 1em;
text-align: right;
line-height: 1.8em;
}
input {
display: block;
float: left;
}
br {
clear: both;
}
< /style>

you can use this CSS between tag < head> and < /head>