手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >用CSS实现表单form布局
用CSS实现表单form布局
摘要:出处:http://blog.donews.com/dodo/archive/2005/06/18/434979.aspx在TABLE布局中...

出处:http://blog.donews.com/dodo/archive/2005/06/18/434979.aspx

在TABLE布局中设计Form,一般都是用2个td来布局,如果不用table,用CSS怎么做呢?看看下面的代码

<style type="text/css">

label{

float: left;

width: 80px;

}

form{margin:0px}

input{

width: 180px;

border:1px solid #808080

}

textarea{

width: 250px;

height: 150px;

}

#sbutton{

margin-left: 80px;

margin-top: 5px;

width:80px;

}

br{

clear: left;

}

</style>

<form action="" method="post">

<label for="user">姓名:</label>

<input type="text" id=user name="user" value="" /><br />

<label for="email">邮件:</label>

<input type="text" id=email name="email" value="" /><br />

<label for="comment">备注:</label>

<textarea id=comment name="comment">

</textarea>

<br />

<input type="submit" id="sbutton" value="确定" /><br />

</form>

【用CSS实现表单form布局】相关文章:

CSS网页布局的技巧

纯CSS实现漂亮tab选项卡切换特效

CSS3实现的炫酷菜单代码分享

用css实现透视效果

怎样用CSS实现大背景网页效果

用CSS实现表格背景颜色渐变效果

用CSS实现垂直居中的3种方法

CSS UL LI布局实现表格效果

使用CSS布局定位属性轻松实现优美站点布局

CSS实现左图右文混排布局的方法

精品推荐
分类导航