正 文

用CSS布局表单实例(抛弃表格)


www.7dspace.com  更新日期:2005-8-16 5:06:56  七度空间


  这是一个学习WEB标准的例子,我们在不使用标准之前为表单布局一般都使用表格,在这个例子中我们抛弃表格,来使用CSS为表单进行布局。


CSS设置代码:


label{
float: left;
width: 120px;
font-weight: bold;
}

input, textarea{
width: 180px;
margin-bottom: 5px;
}

textarea{
width: 250px;
height: 150px;
}

.boxes{
width: 1em;
}

#submitbutton{
margin-left: 120px;
margin-top: 5px;
width: 90px;
}

br{
clear: left;
}

</style>

HTML代码:


</form>

  在这个例子中用 "label" 标签来布局表单的左部,即表单的提示内容,使表单显示的效果明显分为左右两部分,左部的宽度我们可以使用 "label" 标签来控制。


上一篇:如何用CSS制作横向菜单
下一篇:CSS的超级技巧大放送
作者:  来源: ( 责任编辑:7dspace )
收藏此页】【打印】【关闭
站 内 搜 索
 

热 点 导 读
特 别 推 荐