接下来，我们要对每个输入框的样式进行控制，编写CSS代码如下：
.body {
display:block;
margin:0 auto;
width:576px;
}
/* Centre the form within the page */
form {
margin:0 auto;
width:459px;
}
/* Style the text boxes */
input, textarea {
width:439px;
height:27px;
background:#efefef;
border:1px solid #dedede;
padding:10px;
margin-top:3px;
font-size:0.9em;
color:#3a3a3a;
}
textarea {
height:213px;
background:url(images/textarea-bg.jpg) right no-repeat #efefef;
}
display:block;
margin:0 auto;
width:576px;
}
/* Centre the form within the page */
form {
margin:0 auto;
width:459px;
}
/* Style the text boxes */
input, textarea {
width:439px;
height:27px;
background:#efefef;
border:1px solid #dedede;
padding:10px;
margin-top:3px;
font-size:0.9em;
color:#3a3a3a;
}
textarea {
height:213px;
background:url(images/textarea-bg.jpg) right no-repeat #efefef;
}
在上面的CSS中，首先对body页面部分，使用了margin:0 auto;将整个页面设置为居中显示，同理对表单form元素也是如是操作。而input文本框和textarea输入域的大部分属性都相同，所以这里写在一起，而由于textarea文本输入域中需要有一张背景图，因此在这里使用background:url进行设置，并且指定了其no-repeat的属性。在应用上面的样式后，运行效果如下图：
▲
